JavaScript Academy · Leçon

Symboles comme clés d’objet

Utilisez des symboles pour créer des propriétés sans collision.

Symboles comme clés d’objet est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 4 leçons au total.

Les symboles comme clés

Un symbole peut être utilisé comme clé de propriété d’un objet. Comme chaque symbole est unique, une telle propriété ne peut pas entrer accidentellement en collision avec une clé de chaîne.

const id = Symbol("id")
const user = {}
user[id] = 123
console.log(user[id])

Clés de symboles calculées

Pour utiliser un symbole comme clé dans un littéral d’objet, placez-le entre crochets pour former un nom de propriété calculé.

const id = Symbol("id")
const user = {
  name: "Ann",
  [id]: 99
}
console.log(user[id])

Lire une propriété de symbole

Vous devez conserver une référence au même symbole pour lire sa propriété. Sans cette référence, la valeur est effectivement masquée.

const secret = Symbol("secret")
const obj = { [secret]: "hidden" }
console.log(obj[secret])

Non énumérées par for-in

Les clés de symboles sont ignorées par une boucle for-in. Ainsi, les propriétés de symboles restent en dehors des itérations ordinaires.

const tag = Symbol("tag")
const obj = { a: 1, b: 2, [tag]: 3 }
for (const key in obj) {
  console.log(key)
}

Ignorées par Object.keys

Object.keys renvoie uniquement les clés de chaînes, les propriétés dont la clé est un symbole en sont donc également exclues.

const tag = Symbol("tag")
const obj = { a: 1, [tag]: 2 }
console.log(Object.keys(obj))

Masquées par JSON

JSON.stringify ignore complètement les clés de symboles, qui n’apparaissent donc jamais dans la sortie sérialisée. Elles sont ainsi utiles pour les métadonnées internes.

const meta = Symbol("meta")
const obj = { name: "Bo", [meta]: "internal" }
console.log(JSON.stringify(obj))

Trouver les clés de symboles

Pour répertorier les clés de symboles, utilisez Object.getOwnPropertySymbols, qui renvoie un tableau des propriétés de symboles d’un objet.

const tag = Symbol("tag")
const obj = { a: 1, [tag]: 2 }
const syms = Object.getOwnPropertySymbols(obj)
console.log(syms.length)

Éviter les conflits de noms

Les clés de symboles permettent à différentes bibliothèques d’ajouter des propriétés au même objet sans risquer de se les écraser, puisque leurs symboles sont différents.

const libA = Symbol("data")
const libB = Symbol("data")
const shared = {}
shared[libA] = 1
shared[libB] = 2
console.log(shared[libA], shared[libB])

Clés de symboles et décomposition

L’opérateur de décomposition d’objet copie également les clés de symboles, contrairement à for-in et Object.keys. Gardez donc à l’esprit qu’elles sont conservées lors du clonage.

const tag = Symbol("tag")
const src = { a: 1, [tag]: 2 }
const copy = { ...src }
console.log(copy[tag])

Stocker des données quasi privées

Les clés de symboles offrent une forme souple de confidentialité : les données ne sont accessibles qu’au code qui détient le symbole, et restent absentes des listes de propriétés ordinaires.

const balance = Symbol("balance")
function makeAccount() {
  const acct = {}
  acct[balance] = 100
  return { acct: acct, key: balance }
}
const a = makeAccount()
console.log(a.acct[a.key])

Supprimer des propriétés de symboles

Vous supprimez une propriété de symbole comme n’importe quelle autre, en utilisant l’opérateur delete avec la référence du symbole.

const tag = Symbol("tag")
const obj = { [tag]: 5 }
delete obj[tag]
console.log(obj[tag])

Vérification rapide

Vérifiez vos connaissances sur les clés de symboles.

Récapitulatif

Récapitulatif : Les symboles forment des clés d’objet sûres et masquées.

Utilisez des crochets pour les clés de symboles calculées
Ignorées par for-in, Object.keys et JSON
Répertoriées avec Object.getOwnPropertySymbols
Parfaites pour des métadonnées sans conflit

const k = Symbol("k")
const o = { [k]: 7 }
console.log(o[k])

Questions Fréquemment Posées

La leçon « Symboles comme clés d’objet » est-elle gratuite ?

Oui — le texte complet de « Symboles comme clés d’objet » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Symboles comme clés d’objet » ?

Utilisez des symboles pour créer des propriétés sans collision. Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer JavaScript Academy ?

Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 4.

Combien de temps prend la leçon « Symboles comme clés d’objet » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?

Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à JavaScript Academy