Symboles bien connus
Personnalisez le comportement avec Symbol.iterator et d’autres symboles.
Symboles bien connus est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 4 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.
Symboles bien connus
Les symboles bien connus sont des symboles intégrés stockés sur l’objet Symbol. Ils permettent de personnaliser le comportement des objets avec des fonctionnalités du langage comme l’itération et la conversion.
console.log(typeof Symbol.iterator)
console.log(typeof Symbol.toPrimitive)Symbol.iterator
Symbol.iterator définit la manière dont un objet est parcouru par une boucle for-of et l’opérateur de décomposition. Les tableaux et les chaînes intégrés le fournissent déjà.
const arr = [10, 20]
const it = arr[Symbol.iterator]()
console.log(it.next().value)Rendre un objet itérable
Ajoutez une méthode Symbol.iterator qui renvoie un itérateur doté d’une méthode next pour rendre n’importe quel objet utilisable dans une boucle for-of.
const range = {
from: 1,
to: 3,
[Symbol.iterator]() {
let cur = this.from
const last = this.to
return {
next() {
return cur <= last ? { value: cur++, done: false } : { value: undefined, done: true }
}
}
}
}
for (const n of range) {
console.log(n)
}Itérer avec la décomposition
Comme Symbol.iterator contrôle également la décomposition, un objet itérable personnalisé peut être développé en tableau.
const nums = {
[Symbol.iterator]() {
let i = 0
return { next() { return i < 3 ? { value: i++, done: false } : { value: undefined, done: true } } }
}
}
console.log([...nums])Symbol.toPrimitive
Symbol.toPrimitive permet à un objet de contrôler sa conversion en valeur primitive dans des contextes numériques, textuels ou par défaut.
const money = {
amount: 50,
[Symbol.toPrimitive](hint) {
if (hint === "number") return this.amount
return "$" + this.amount
}
}
console.log(+money)
console.log(money + "")L’argument d’indication
Le gestionnaire de conversion reçoit une indication correspondant à number, string ou default, ce qui vous permet de renvoyer une valeur adaptée à chaque situation.
const obj = {
[Symbol.toPrimitive](hint) {
return hint
}
}
console.log(+obj)
console.log(obj + "")
console.log(String(obj))Symbol.toStringTag
Symbol.toStringTag personnalise le texte que toString renvoie par défaut pour un objet, ce qui est utile pour créer des étiquettes de type personnalisées.
const widget = {
[Symbol.toStringTag]: "Widget"
}
console.log(Object.prototype.toString.call(widget))Symbol.hasInstance
Symbol.hasInstance permet à une classe ou à un objet de personnaliser le comportement de l’opérateur instanceof.
class Even {
static [Symbol.hasInstance](num) {
return num % 2 === 0
}
}
console.log(4 instanceof Even)
console.log(3 instanceof Even)Les éléments intégrés les utilisent aussi
Les tableaux, les tables associatives, les ensembles et les chaînes implémentent tous Symbol.iterator, ce qui explique pourquoi ils fonctionnent naturellement avec for-of et la décomposition.
const set = new Set([1, 2, 3])
console.log([...set])Pourquoi ils sont importants
Les symboles bien connus sont des points d’extension : ils permettent à vos objets de s’intégrer naturellement aux opérations intégrées du langage au lieu d’être traités comme des cas particuliers.
const list = {
items: ["a", "b"],
[Symbol.iterator]() {
return this.items[Symbol.iterator]()
}
}
for (const x of list) {
console.log(x)
}Les découvrir
L’objet Symbol expose ces symboles sous forme de propriétés statiques. Vous pouvez les référencer comme Symbol.iterator et Symbol.toPrimitive partout où cela est nécessaire.
console.log(typeof Symbol.iterator)
console.log(typeof Symbol.toStringTag)
console.log(typeof Symbol.hasInstance)Vérification rapide
Vérifiez vos connaissances sur les symboles bien connus.
Récapitulatif
Récapitulatif : Les symboles bien connus personnalisent le comportement du langage.
- Symbol.iterator contrôle for-of et la décomposition
- Symbol.toPrimitive contrôle les conversions au moyen d’une indication
- Symbol.toStringTag étiquette les objets
- Symbol.hasInstance personnalise instanceof
const r = { [Symbol.iterator]() { let i = 0; return { next() { return i < 2 ? { value: i++, done: false } : { value: 0, done: true } } } } }
console.log([...r])
Apprends JavaScript avec un tuteur IA — gratuit
Écris et exécute du vrai code dans ton navigateur, obtiens de l'aide instantanée d'un tuteur IA disponible 24h/24, et reprends là où tu t'es arrêté sur le web ou dans l'app.
- Cours
- 59
- Leçons
- 200
Questions Fréquemment Posées
La leçon « Symboles bien connus » est-elle gratuite ?
Oui — le texte complet de « Symboles bien connus » 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 bien connus » ?
Personnalisez le comportement avec Symbol.iterator et d’autres symboles. 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 4 sur 4.
Combien de temps prend la leçon « Symboles bien connus » ?
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
- Créer des symboles uniques
- Symboles comme clés d’objet
- Registre mondial des symboles
- Symboles bien connus