JavaScript Academy · Lezione

Symbol well-known

Personalizzi il comportamento con Symbol.iterator e altri symbol.

Lezione 4 di 413 passaggi

Symbol well-known è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 4 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.

Simboli noti

I simboli noti sono simboli integrati memorizzati nell'oggetto Symbol. Consentono di personalizzare il comportamento degli oggetti con funzionalità del linguaggio come l'iterazione e la conversione.

console.log(typeof Symbol.iterator)
console.log(typeof Symbol.toPrimitive)

Symbol.iterator

Symbol.iterator definisce il modo in cui un oggetto viene iterato da un ciclo for-of e dall'operatore spread. Gli array e le stringhe integrati lo forniscono già.

const arr = [10, 20]
const it = arr[Symbol.iterator]()
console.log(it.next().value)

Rendere iterabile un oggetto

Per rendere un oggetto utilizzabile in un ciclo for-of, aggiunga un metodo Symbol.iterator che restituisca un iteratore con un metodo next.

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

Iterare con spread

Poiché Symbol.iterator controlla anche l'espansione, un iterabile personalizzato può essere trasformato in un array.

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 consente a un oggetto di controllare la conversione in un valore primitivo nei contesti numerico, stringa o predefinito.

const money = {
  amount: 50,
  [Symbol.toPrimitive](hint) {
    if (hint === "number") return this.amount
    return "$" + this.amount
  }
}
console.log(+money)
console.log(money + "")

L'argomento hint

Il gestore della conversione riceve un hint, ovvero number, string o default, che consente di restituire un valore adatto a ogni situazione.

const obj = {
  [Symbol.toPrimitive](hint) {
    return hint
  }
}
console.log(+obj)
console.log(obj + "")
console.log(String(obj))

Symbol.toStringTag

Symbol.toStringTag personalizza il testo che il metodo toString predefinito restituisce per un oggetto, risultando utile per le etichette di tipo personalizzate.

const widget = {
  [Symbol.toStringTag]: "Widget"
}
console.log(Object.prototype.toString.call(widget))

Symbol.hasInstance

Symbol.hasInstance consente a una classe o a un oggetto di personalizzare il comportamento dell'operatore instanceof.

class Even {
  static [Symbol.hasInstance](num) {
    return num % 2 === 0
  }
}
console.log(4 instanceof Even)
console.log(3 instanceof Even)

Anche gli integrati li usano

Array, mappe, set e stringhe implementano tutti Symbol.iterator, motivo per cui funzionano senza problemi con for-of e spread.

const set = new Set([1, 2, 3])
console.log([...set])

Perché sono importanti

I simboli noti sono punti di estensione: consentono agli oggetti di integrarsi naturalmente con le operazioni integrate del linguaggio, invece di richiedere casi speciali.

const list = {
  items: ["a", "b"],
  [Symbol.iterator]() {
    return this.items[Symbol.iterator]()
  }
}
for (const x of list) {
  console.log(x)
}

Individuarli

L'oggetto Symbol li espone come proprietà statiche. Può fare riferimento a loro, ad esempio con Symbol.iterator e Symbol.toPrimitive, ovunque sia necessario.

console.log(typeof Symbol.iterator)
console.log(typeof Symbol.toStringTag)
console.log(typeof Symbol.hasInstance)

Verifica rapida

Verifichi la Sua conoscenza dei simboli noti.

Riepilogo

Riepilogo: i simboli noti personalizzano il comportamento del linguaggio.

  • Symbol.iterator controlla for-of e spread
  • Symbol.toPrimitive controlla le conversioni tramite un hint
  • Symbol.toStringTag assegna un'etichetta agli oggetti
  • Symbol.hasInstance personalizza instanceof
const r = { [Symbol.iterator]() { let i = 0; return { next() { return i < 2 ? { value: i++, done: false } : { value: 0, done: true } } } } }
console.log([...r])
Gratis per iniziare

Impara JavaScript con un tutor IA — gratis

Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.

Corsi
59
Lezioni
200

Domande Frequenti

La lezione «Symbol well-known» è gratuita?

Sì — il testo completo di «Symbol well-known» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.

Cosa imparerò in «Symbol well-known»?

Personalizzi il comportamento con Symbol.iterator e altri symbol. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare JavaScript Academy?

Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 4 di 4.

Quanto tempo richiede la lezione «Symbol well-known»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?

Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

  1. Creare Symbol univoci
  2. Symbol come chiavi degli oggetti
  3. Il registro globale dei Symbol
  4. Symbol well-known
← Torna a JavaScript Academy