Obtenha o tipo de uma variável em JavaScript

1. Usando o operador typeof para encontrar o tipo de variável
2. Usando o operador typeof em verificações condicionais
3. Observação:

Comparando com outras linguagens de programação como C, Java etc., JavaScript dá a liberdade aos desenvolvedores para definir variáveis ​​de qualquer tipo com uma única palavra-chave (a palavra-chave var). O JavaScript, por sua vez, decide o tipo de dado da variável, posteriormente, dependendo dos valores atribuídos a essas variáveis. Parece fácil determinar o tipo de dados de uma variável. Mas alguns cenários podem nos colocar em uma correção. Especialmente no caso de valores retornados pela resposta da API REST do servidor, podemos precisar saber o tipo do valor ou variável antes de codificarmos para processá-lo.

Usando o operador typeof para encontrar o tipo de variável

typeof é um operador unário em javascript que retorna o tipo de um operando ao qual é aplicado. Normalmente retorna o tipo de variável como um objeto de string. Existem tipos de retorno padrão para o operador typeof em javascript.

• string: typeof retorna string para uma string do tipo variável.
• number: retorna number para uma variável que contém um valor inteiro ou de ponto flutuante.
• boolean: Para uma variável que contém valores true ou false, typeof retorna boolean.
• undefined: caso não atribuamos valores a uma variável, o tipo da variável será marcado como undefined pelo JavaScript. Conseqüentemente, o operando typeof retornará undefined para tais variáveis ​​não declaradas.
• object: Para variáveis ​​que contêm um array, ou um objeto em {}, ou variáveis ​​atribuídas com valor null, o javascript considera o tipo de tais variáveis ​​como um objeto. Portanto, o operando typeof retornará object.
• function: o JavaScript permite-nos atribuir funções a uma variável. Para tais casos, o tipo de tais variáveis ​​será function. O operador typeof retornará função para uma atribuição de função.

O fragmento de código a seguir demonstra o comportamento do operador typeof para diferentes atribuições de variáveis ​​e diferentes cenários.

var s1 = 'hello';
var n1 = 120;
var n1 = 11.1234;
var b1 = true;
var x;
var u = undefined;
var o1 = null;
var o2 = {id: 1, value: 200};
var o3 = [1, 2, 3];
var f = function() {
  return 1 + 2
};

console.log(typeof s1);
console.log(typeof n1);
console.log(typeof n1);
console.log(typeof b1);
console.log(typeof x);
console.log(typeof u);
console.log(typeof o1);
console.log(typeof o2);
console.log(typeof o3);
console.log(typeof f);

Produção:

"string"
"number"
"number"
"boolean"
"undefined"
"undefined"
"object"
"object"
"object"
"function"

Usando o operador typeof em verificações condicionais

Podemos usar o operador typeof em verificações condicionais, como no bloco if, verificando o valor retornado pelo operador e comparando-o com os valores de tipo padrão. Usamos o operador === para comparação, pois inclui verificações de tipo de operandos em ambas as extremidades do operador.

var a = 'hello';
if (typeof a === 'string') {
  console.log(true)
}

Produção:

true

Da mesma forma, podemos fazer verificações condicionais para number, boolean, object e até mesmo para function. Como prática recomendada, devemos criar uma variável constante para os tipos de dados padrão retornados pelo operador typeof do javascript. Em seguida, compare o typeof de uma variável com as constantes declaradas. Essa abordagem facilita a codificação e reduz erros de digitação ao escrever os blocos condicionais, que geralmente não são captados de relance. Consulte o código a seguir para entender melhor.

const STRING_TYPE = 'string';
const NUMBER_TYPE = 'number';
var a = 'hello';
var b = 123;
if (typeof a === STRING_TYPE) {
  console.log(true)
}
if (typeof b === NUMBER_TYPE) {
  console.log(true)
}

Produção:

true
true

Observação:

• Para os casos em que uma variável é atribuída com uma palavra-chave new, o javascript irá considerar tal atribuição como um objeto. Conseqüentemente, o operador typeof retornará object para tais atribuições. Consulte o código a seguir.

var s = new String('hello');
var n = new Number(100);
console.log(typeof s);
console.log(typeof n);

Produção:

object
object

• Se atribuirmos uma função usando a palavra-chave new, o tipo de dados de tais variáveis ​​é considerado uma função por javascript. A variável typeof com new function() retornará como function em vez de object. Vejamos o código a seguir.

var fn = new Function();

Produção:

"function"

• Todos os navegadores suportam o operador typeof de javascript, incluindo as versões antigas do Internet Explorer. Portanto, podemos usar o operador sem quaisquer preocupações em um projeto com suporte em vários navegadores.