Obtenir le type d'une variable en JavaScript

1. Utilisation de l’opérateur typeof pour trouver le type de variable
2. Utilisation de l’opérateur typeof dans les contrôles conditionnels
3. Noter:

Comparé à d’autres langages de programmation comme C, Java etc., JavaScript donne la liberté aux développeurs de définir des variables de n’importe quel type avec un seul mot-clé (le mot-clé var). JavaScript, à son tour, décide du type de données de la variable, plus tard, en fonction des valeurs attribuées à ces variables. Il est apparemment facile de déterminer le type de données d’une variable. Mais certains scénarios peuvent nous mettre dans le pétrin. Surtout dans le cas des valeurs renvoyées par la réponse de l’API REST du serveur, nous pouvons avoir besoin de connaître le type de la valeur ou de la variable avant de continuer à coder pour la traiter.

Utilisation de l’opérateur typeof pour trouver le type de variable

typeof est un opérateur unaire en javascript qui renvoie le type d’un opérande auquel il est appliqué. Il renvoie généralement le type de variable sous forme d’objet chaîne. Il existe des types de retour standard pour l’opérateur typeof en javascript.

• string : typeof renvoie string pour une variable de type chaîne.
• number : Il retourne number pour une variable contenant un entier ou une valeur à virgule flottante.
• boolean : Pour une variable contenant des valeurs true ou false, typeof renvoie boolean.
• undefined : dans le cas où nous n’attribuons pas de valeurs à une variable, le type de la variable sera marqué comme undefined par JavaScript. Par conséquent, l’opérande typeof renverra undefined pour de telles variables non déclarées.
• object : pour les variables qui contiennent un tableau, ou un objet dans {}, ou les variables affectées avec une valeur null, javascript considère le type de ces variables comme un objet. Par conséquent, l’opérande typeof renverra object.
• function : JavaScript permet d’affecter des fonctions à une variable. Pour de tels cas, le type de ces variables sera function. L’opérateur typeof renverra function pour une affectation de fonction.

L’extrait de code suivant montre le comportement de l’opérateur typeof pour différentes affectations de variables et différents scénarios.

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

Production:

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

Utilisation de l’opérateur typeof dans les contrôles conditionnels

Nous pouvons utiliser l’opérateur typeof dans les contrôles conditionnels comme dans le bloc if en vérifiant la valeur renvoyée par l’opérateur et en la comparant avec les valeurs de type standard. Nous utilisons l’opérateur === pour la comparaison car il inclut des vérifications de type des opérandes aux deux extrémités de l’opérateur.

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

Production:

true

De même, on peut faire des vérifications conditionnelles pour number, boolean, object et même pour function. Comme bonne pratique, nous devrions créer une variable constante pour les types de données standard renvoyés par l’opérateur typeof de javascript. Ensuite, comparez le typeof d’une variable aux constantes déclarées. Cette approche facilite le codage et réduit les fautes de frappe lors de l’écriture des blocs conditionnels, qui ne sont généralement pas détectés en un coup d’œil. Référez-vous au code suivant pour mieux comprendre.

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

Production:

true
true

Noter:

• Pour les cas ayant une variable affectée avec un mot-clé new, javascript considérera une telle affectation comme un objet. Par conséquent, l’opérateur typeof renverra object pour de telles affectations. Référez-vous au code suivant.

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

Production:

object
object

• Si on affecte une fonction à l’aide du mot-clé new, alors le type de données de ces variables est pris comme fonction par javascript. La variable typeof avec new function() retournera comme function au lieu de object. Regardons le code suivant.

var fn = new Function();

Production:

"function"

• Tous les navigateurs supportent l’opérateur typeof de javascript, y compris les anciennes versions d’Internet Explorer. Ainsi, nous pouvons utiliser l’opérateur sans aucun souci dans un projet pris en charge sur plusieurs navigateurs.