Obtener el tipo de una variable en JavaScript

1. Uso del operador typeof para encontrar el tipo de variable
2. Uso del operador typeof en verificaciones condicionales
3. Nota:

En comparación con otros lenguajes de programación como C, Java, etc., JavaScript da a los desarrolladores la libertad de definir variables de cualquier tipo con una sola palabra clave (la palabra clave var). JavaScript, a su vez, decide el tipo de datos de la variable, posteriormente, en función de los valores asignados a estas variables. Aparentemente, es fácil determinar el tipo de datos de una variable. Pero algunos escenarios pueden ponernos en una solución. Especialmente en el caso de valores devueltos por la respuesta de la API REST del servidor, es posible que necesitemos saber el tipo de valor o variable antes de seguir codificando para procesarlo.

Uso del operador typeof para encontrar el tipo de variable

typeof es un operador unario en javascript que devuelve el tipo de operando al que se aplica. Por lo general, devuelve el tipo de variable como un objeto de cadena. Hay tipos de retorno estándar para el operador typeof en javascript.

• string: typeof devuelve string para una cadena de tipo variable.
• number: Devuelve number para una variable que contiene un valor entero o de coma flotante.
• boolean: para una variable que contenga valores true o false, typeof devuelve booleano.
• undefined: en caso de que no asignemos valores a una variable, el tipo de la variable será marcado como undefined por JavaScript. Por tanto, el operando typeof devolverá undefined para tales variables no declaradas.
• object: para variables que contienen un array, o un objeto en {}, o variables asignadas con valor null, javascript considera el tipo de tales variables como un objeto. Por tanto, el operando typeof devolverá objeto.
• function: JavaScript nos permite asignar funciones a una variable. Para tales casos, el tipo de tales variables será function. El operador typeof devolverá function para una asignación de función.

El siguiente fragmento de código demuestra el comportamiento del operador typeof para diferentes asignaciones de variables y diferentes escenarios.

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);

Producción :

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

Uso del operador typeof en verificaciones condicionales

Podemos usar el operador typeof en verificaciones condicionales como en el bloque if comprobando el valor devuelto por el operador y comparándolo con los valores de tipo estándar. Usamos el operador === para la comparación, ya que incluye verificaciones de tipo de operandos en ambos extremos del operador.

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

Producción :

true

Del mismo modo, podemos hacer comprobaciones condicionales para number, boolean, object e incluso para function. Como práctica recomendada, deberíamos crear una variable constante para los tipos de datos estándar devueltos por el operador typeof de javascript. Luego, compare el typeof de una variable con las constantes declaradas. Este enfoque facilita la codificación y reduce los errores tipográficos al escribir los bloques condicionales, que generalmente no se detectan de un vistazo. Consulte el siguiente código para comprender mejor.

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)
}

Producción :

true
true

Nota:

• Para los casos que tienen una variable asignada con una palabra clave new, javascript considerará dicha asignación como un objeto. Por tanto, el operador typeof devolverá object para tales asignaciones. Consulte el siguiente código.

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

Producción :

object
object

• Si asignamos una función usando la palabra clave new, entonces el tipo de datos de dichas variables es tomado como una función por javascript. La variable typeof con new function() volverá como function en lugar de object. Veamos el siguiente código.

var fn = new Function();

Producción :

"function"

• Todos los navegadores admiten el operador typeof de javascript, incluidas las versiones antiguas de Internet Explorer. Por lo tanto, podemos utilizar el operador sin preocupaciones en un proyecto compatible con varios navegadores.