Cosa fanno le parentesi graffe nelle istruzioni `var {...} = ...`?

Question

Non sono sicuro se questa è una sintassi di Mozilla-specifica JS, ma ho trovato spesso variabili di essere dichiarate in questo modo, ad esempio, in add-on SDK docs:

var { Hotkey } = require("sdk/hotkeys"); 

e in vari Javascript cromo (let dichiarazione viene utilizzato in luogo di var),

let { classes: Cc, interfaces: Ci, results: Cr, utils: Cu } = Components; 

ho trovato molto confuso, ma io non sto essendo in grado di trovare alcuna documentazione circa sia la sintassi, anche su MDN.

Answer 1

Sono entrambe le funzioni di JavaScript 1.7. Il primo è block-level variables:

let permette di dichiarare le variabili, che limita il campo di applicazione al blocco, dichiarazione o espressione su cui viene utilizzato. Diversamente dalla parola chiave var, che definisce una variabile globalmente o localmente su un'intera funzione indipendentemente dall'ambito del blocco.

Il secondo è chiamato destructuring:

assegnamento destrutturato rende possibile estrarre dati da array o oggetti utilizzando una sintassi che rispecchia la costruzione di array e di oggetto letterali.
...
Una cosa particolarmente utile che si può fare con l'assegnazione della destrutturazione è quella di leggere un'intera struttura in una singola istruzione, sebbene ci siano un numero di cose interessanti che si possono fare con loro, come mostrato nella sezione piena di esempi quello segue.

Per chi ha familiarità con Python, è simile a questa sintassi:

>>> a, (b, c) = (1, (2, 3)) 
>>> a, b, c 
(1, 2, 3) 

Il primo blocco di codice è una scorciatoia per:

var {Hotkey: Hotkey} = require("sdk/hotkeys"); 
// Or 
var Hotkey = require("sdk/hotkeys").Hotkey; 

È possibile riscrivere il secondo pezzo di codice come:

let Cc = Components.classes; 
let Ci = Components.interfaces; 
let Cr = Components.results; 
let Cu = Components.utils; 

Answer 2

C'è documentazione per il let dichiarazione sul MDN: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/let

let è simile a var in quanto limita il campo di applicazione della variabile dichiarata. Permette di dichiarare una variabile all'interno di un blocco if(){} (o qualche altro blocco) e di avere tale variabile solo "visibile" all'interno di quel blocco (JavaScript, fino ad ora, ha scope di funzioni e non scope block come la maggior parte degli altri linguaggi). Quindi lo let è fondamentalmente una "correzione" per qualcosa con cui molti hanno problemi. Tieni presente che tih è una funzionalità di JavaScript 1.7.

Non ho trovato nulla su {Foo}.

Answer 3

Quello che stai guardando è un destructu assegnazione dell'anello. È una forma di pattern matching come in Haskell.

Utilizzando l'assegnazione di destrutturazione è possibile estrarre valori da oggetti e matrici e assegnarli a variabili appena dichiarate utilizzando la sintassi letterale dell'oggetto e dell'array. Questo rende il codice molto più succinto.

Ad esempio:

var ascii = { 
    a: 97, 
    b: 98, 
    c: 99 
}; 

var {a, b, c} = ascii; 

Il codice sopra è equivalente a:

var ascii = { 
    a: 97, 
    b: 98, 
    c: 99 
}; 

var a = ascii.a; 
var b = ascii.b; 
var c = ascii.c; 

Analogamente per le matrici:

var ascii = [97, 98, 99]; 

var [a, b, c] = ascii; 

Ciò equivale a:

var ascii = [97, 98, 99]; 

var a = ascii[0]; 
var b = ascii[1]; 
var c = ascii[2]; 

Si può anche utilizzare let per estrarre e rinominare proprietà di un oggetto come segue:

var ascii = { 
    a: 97, 
    b: 98, 
    c: 99 
}; 

let {a: A, b: B, c: C} = ascii; 

Ciò equivale a:

var ascii = { 
    a: 97, 
    b: 98, 
    c: 99 
}; 

var A = ascii.a; 
var B = ascii.b; 
var C = ascii.c; 

Questo è tutto ciò che devi fare.