Types de symboles JavaScript

❮ Précédent Suivant ❯

En général, les clés de propriété d'objet peuvent être de deux types : chaîne et symbole. Les symboles sont finalement des identifiants uniques. Ils peuvent être créés en utilisant la fonction d'usine Symbol().

Par exemple:

javascript symbol

Après avoir créé un symbole, vous pouvez lui donner un nom ou une description. C'est particulièrement utile pour les pratiques de débogage. Jetons un coup d'œil à l'exemple suivant:

//  id is a symbol, it's a description "id"
let id = Symbol("id");

Comme nous l'avons déjà noté, les symboles sont uniques. Même lorsque vous créez une variété de symboles avec le même nom, ils sont considérés comme des symboles différents.

N'oubliez pas que les descriptions et les noms ne sont que des étiquettes qui n'affectent rien.

Voici un exemple:

Javascript symbol type

let mySymbol1 = Symbol("mySymbol"); let mySymbol2 = Symbol("mySymbol"); console.log(mySymbol1 == mySymbol2); // false

Dans le cas ci-dessus, les deux symboles ont la même description, mais ils ne sont pas égaux.

Il est important de savoir qu'il n'est pas possible d'auto-convertir les symboles en une chaîne.

Par exemple, cette alerte entraînera une erreur:

Javascript symbol type

let mySymbol = Symbol("mySymbol"); console.log(mySymbol); // TypeError: Cannot convert a Symbol value to a string

Pour afficher un symbole, vous devez explicitement appeler .toString() dessus, comme suit:

javascript symbol type

let mySymbol = Symbol("mySymbol"); console.log(mySymbol.toString()); // Symbol(mySymbol), now it works

Pour obtenir la propriété symbol.description, appelez:

Javascript symbol description

let mySymbol = Symbol("mySymbol"); console.log(mySymbol.description); // mySymbol

À propos des propriétés “Cachées”

Avec l'aide de symboles, vous pouvez facilement créer les soi-disant propriétés “cachées” d'un objet. Il est impossible d'accéder ou de remplacer d'autres parties du code.

Si vous travaillez avec des objets site appartenant à un code tiers, vous devrez leur ajouter des identifiants. Il est nécessaire d'utiliser une clé de symbole pour cela, comme suit:

Javascript symbol key

let site = { // belongs to another code name: "W3Docs" }; let id = Symbol("id"); site[id] = 1; console.log(site[id]); // we can access the data using the symbol as the key

Dans un autre cas, lorsqu'un autre script veut avoir son identifiant à l'intérieur du site.

Cela pourrait être une autre bibliothèque JavaScript de sorte que les scripts ne sont pas conscients les uns des autres.

Donc, ce script peut créer son Symbol("id").

Par exemple:

// ...
let id = Symbol("id");
site[id] = "Their id value";

Symboles dans un littéral

Pour utiliser un symbole dans un littéral d'objet, il est nécessaire d'insérer des crochets autour de celui-ci.

Regardez simplement cet exemple:

Javascript symbol

let id = Symbol("id"); let site = { name: "W3Docs", [id]: 100 // not "id: 100" }; console.log(site[id]);

C'est parce que vous avez besoin de la valeur de la variable, id comme clé mais pas de la chaîne “id”.

Le for…in ignore les symboles

La boucle for..in n'intègre pas les propriétés symboliques. Voici un exemple:

Javascript symbol for..in loop

let id = Symbol("id"); let site = { name: "W3Docs", [id]: 10 }; for (let key in site) { console.log(key); // name , no symbols } console.log("Direct: " + site[id]); // works the direct access by the symbol

Symboles globaux

Comme nous l'avons déjà mentionné, les symboles sont uniques, même s'ils ont la même description. Mais, parfois, vous pourriez avoir besoin que les symboles avec le même nom soient les mêmes entités. Par exemple, différentes parties de votre application souhaitent accéder au symbole "id" qui signifie la même propriété.

Un registre global de symboles est là pour réaliser cela. Il permet de créer des symboles à l'intérieur et d'y accéder plus tard. De plus, il garantit que les accès continus par le même nom montrent précisément le même symbole. Pour lire un symbole du registre global, il est recommandé d'utiliser Symbol.for(key).

Utiliser cet appel aide à vérifier le registre global. Ensuite, s'il existe un symbole, défini comme key, il sera renvoyé. Sinon, un nouveau symbole Symbol(key) sera créé et stocké dans le registre par une key particulière.

C'est démontré dans l'exemple ci-dessous:

Javascript symbol.for the global registry

// read from the global registry let id = Symbol.for("id"); // if this the symbol did not exist, it's created // read it again let idAgain = Symbol.for("id") // the same symbol console.log(id === idAgain); // true

Les symboles qui sont dans le registre sont connus comme des symboles globaux. Vous pouvez les utiliser lorsque vous voulez un symbole global qui a une entrée partout dans le code.

Symbol.keyFor

Il est possible d'utiliser un appel inverse pour les symboles globaux. Vous pouvez le faire avec l'aide de Symbol.keyFor(sym). Cela fera l'inverse : renvoyer un nom par un symbole global.

Pour une meilleure compréhension, consultez l'exemple suivant:

Javascript global symbol

// get symbol by name let sym1 = Symbol.for("siteName"); let sym2 = Symbol.for("id"); // get name by symbol console.log(Symbol.keyFor(sym1)); // siteName console.log(Symbol.keyFor(sym2)); // id

Le Symbol.keyFor fonctionnera exclusivement pour les symboles globaux. Dans le cas où le symbole s'avère ne pas être global, il n'y aura pas d'option pour le trouver et renvoyer undefined. En d'autres termes, chaque symbole a une propriété description.

Par exemple:

Javascript symbol description

let globalSymbol = Symbol.for("name"); let localSymbol = Symbol("name"); console.log(Symbol.keyFor(globalSymbol)); // name, global symbol console.log(Symbol.keyFor(localSymbol)); // undefined, not global console.log(localSymbol.description); // name

Symboles système

En interne, JavaScript utilise une large gamme de symboles système.

Voici quelques-uns d'entre eux:

Symbol.hasInstance
Symbol.iterator
Symbol.isConcatSpreadable
Symbol.toPrimitive

Il y a beaucoup d'autres symboles système, également.

Par exemple, Symbol.toPrimitive est destiné à décrire la conversion d'objet en primitif.

Symbol.isConcatSpreadable peut être décrit comme un symbole assez spécifique. Il pilote le comportement de Array#concat..

Résumé

En JavaScript, les symboles garantissent un niveau d'accès unique aux objets. Tous les développeurs doivent avoir une compréhension de base des symboles et de leurs cas d'utilisation.

Techniquement, les symboles ne sont pas entièrement cachés. Une méthode intégrée Object.getOwnPropertySymbols(obj) vous permet de recevoir tous les symboles. Il existe une autre méthode, appelée Reflect.ownKeys(obj),, qui vise à renvoyer toutes les clés d'un objet, y compris celles symboliques. Quoi qu'il en soit, la plupart des bibliothèques, des constructions syntaxiques et des fonctions intégrées évitent d'utiliser les méthodes mentionnées ci-dessus.

Heure du Quiz : Testez Vos Compétences!

Prêt à relever le défi de ce que vous avez appris ? Plongez dans nos quiz interactifs pour approfondir votre compréhension et renforcer vos connaissances de manière ludique.