JavaScript typeof
L'opérateur typeof
L'opérateur typeof renvoie le type de données d'une variable JavaScript.
Types de données primitifs
En JavaScript, une valeur primitive est une valeur unique sans propriétés ni méthodes.
JavaScript dispose de 7 types de données primitifs :
- chaîne
- nombre
- booléen
- bigint
- symbole
- null
- indéfini
L'opérateur typeof renvoie le type d'une variable ou d'une expression.
Exemples
typeof "John" // Renvoie chaîne
typeof ("John"+"Doe") // Renvoie chaîne
typeof 3.14 // Renvoie nombre
typeof 33 // Renvoie nombre
typeof (33 + 66) // Renvoie nombre
typeof true // Renvoie booléen
typeof false // Renvoie booléen
typeof 1234n // Renvoie bigint
typeof Symbol() // Renvoie symbole
typeof x // Renvoie indéfini
typeof null // Renvoie objet Remarque :
En JavaScript, null est une valeur primitive.
Cependant, typeof renvoie objet.
C'est un bug bien connu en JavaScript et cela a des raisons historiques.
Types de données complexes
Un type de données complexe peut stocker plusieurs valeurs et/ou différents types de données ensemble.
JavaScript a un type de données complexe :
- objet
Tous les autres types complexes, comme les tableaux, les fonctions, les ensembles et les cartes, ne sont que différents types d'objets.
L'opérateur typeof ne renvoie que deux types :
- objet
- fonction
Exemple
typeof {name:'John'} // Renvoie objet
typeof [1,2,3,4] // Renvoie objet
typeof new Map() // Renvoie objet
typeof new Set() // Renvoie objet
typeof function (){} // Renvoie fonction
Remarque :
L'opérateur typeof renvoie objet pour tous les types d'objets :
- objets
- tableaux
- dates
- ensembles
- cartes
Vous ne pouvez pas utiliser typeof pour déterminer si un objet JavaScript est un tableau ou une date.
Comment reconnaître un tableau
Comment savoir si une variable est un tableau ?
ECMAScript 5 (2009) a défini une nouvelle méthode pour cela : Array.isArray() :
Exemple
// Créer un tableau
const fruits = ["apples", "bananas", "oranges"];
Array.isArray(fruits); L'opérateur instanceof
L'opérateur instanceof renvoie true si un objet est une instance d'un type d'objet spécifié :
Exemples
// Créer une date
const time = new Date();
(time instanceof Date); // Créer un tableau
const fruits = ["apples", "bananas", "oranges"];
(fruits instanceof Array); // Créer une carte
const fruits = new Map([
["apples", 500],
["bananas", 300],
["oranges", 200]
]);
(fruits instanceof Map); // Créer un ensemble
const fruits = new Set(["apples", "bananas", "oranges"]);
(fruits instanceof Set); Variables indéfinies
Le typeof d'une variable indéfinie est undefined .
Exemple
typeof car; Le typeof d'une variable sans valeur est undefined . La valeur est également undefined .
Exemple
let car;
typeof car; Toute variable peut être vidée en définissant sa valeur sur undefined .
Le type sera également undefined .
Exemple
let car = "Volvo";
car = undefined; Valeurs vides
Une valeur vide n'a rien à voir avec undefined .
Une chaîne vide a à la fois une valeur légale et un type.
Exemple
let car = "";
typeof car; Null
En JavaScript, null signifie "rien". Cela représente quelque chose qui n'existe pas.
Malheureusement, en JavaScript, le type de données de null est un objet.
Vous pouvez vider un objet en le définissant sur null :
Exemple
// Créer un objet
let person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null;
// Maintenant la valeur est null, mais le type est toujours un objet
Vous pouvez également vider un objet en le définissant sur undefined :
Exemple
let person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = undefined;
// Maintenant, la valeur et le type sont indéfinis
Différence entre indéfini et null
undefined et null sont égaux en valeur mais différents en type :
typeof undefined // undefined
typeof null // objet
null === undefined // faux
null == undefined // vrai La propriété constructor
La propriété constructor renvoie la fonction constructeur pour toutes les variables JavaScript.
Exemple
// Renvoie la fonction Object() {[code natif]}:
{name:'John',age:34}.constructor
// Renvoie la fonction Array() {[code natif]}:
[1,2,3,4].constructor
// Renvoie la fonction Date() {[code natif]}:
new Date().constructor
// Renvoie la fonction Set() {[code natif]}:
new Set().constructor
// Renvoie la fonction Map() {[code natif]}:
new Map().constructor
// Renvoie la fonction Function() {[code natif]}:
function () {}.constructor
Avec le constructeur, vous pouvez vérifier si un objet est un tableau :
Exemple
(myArray.constructor === Array);
Avec le constructeur, vous pouvez vérifier si un objet est une date :
Exemple
(myDate.constructor === Date);
Tout ensemble
typeof "John" // Renvoie "chaîne"
typeof ("John"+"Doe") // Renvoie "chaîne"
typeof 3.14 // Renvoie "nombre"
typeof (33 + 66) // Renvoie "nombre"
typeof NaN // Renvoie "nombre"
typeof 1234n // Renvoie "bigint"
typeof true // Renvoie "booléen"
typeof false // Renvoie "booléen"
typeof {name:'John'} // Renvoie "objet"
typeof [1,2,3,4] // Renvoie "objet"
typeof {} // Renvoie "objet"
typeof [] // Renvoie "objet"
typeof new Object() // Renvoie "objet"
typeof new Array() // Renvoie "objet"
typeof new Date() // Renvoie "objet"
typeof new Set() // Renvoie "objet"
typeof new Map() // Renvoie "objet"
typeof function () {} // Renvoie "fonction"
typeof x // Renvoie "indéfini"
typeof null // Renvoie "objet" Remarque :
Le type de données de NaN (Not a Number) est nombre !
L'opérateur void
L'opérateur void évalue une expression et renvoie indéfini . Cet opérateur est souvent utilisé pour obtenir la valeur primitive indéfinie, en utilisant "void(0)" (utile lors de l'évaluation d'une expression sans utiliser la valeur de retour).
Exemple
<a href="javascript:void(0);">
Lien inutile
</a>
<a href="javascript:void(document.body.style.backgroundColor='red');">
Cliquez sur moi pour changer la couleur de fond du corps en rouge
</a>