Qual è la differenza tra chiavi oggetto con virgolette e senza virgolette?

209

C'è qualche differenza tra

obj = {'foo': 'bar'}

e

obj = {foo: 'bar'}

Ho notato che non è possibile utilizzare -la chiave quando non uso le virgolette. Ma fa davvero la differenza? Se si quale?

javascript

— meo
fonte

136

No, le virgolette non fanno differenza (a meno che, come hai notato, non desideri utilizzare una chiave che non sia un identificatore JavaScript valido).

Come nota a margine, il formato di scambio dei dati JSON non richiede doppie virgolette intorno identificatori (e non senza permettere virgolette singole).

— bdukes
fonte

88

In realtà, le virgolette possono fare la differenza se usi un valore letterale numerico come nome di proprietà. Ad esempio, obj = { 12e34: true };non è lo stesso di obj = { '12e34': true };. Il primo richiederebbe di accedere alla proprietà tramite obj['1.2e+35'], mentre per il secondo che useresti obj['12e34']. Vedi la mia risposta per maggiori dettagli.

— Mathias Bynens,

1

Vero, ma sarebbe geniale se le doppie virgolette fossero opzionali dato il primo carattere az + alfanumerico e potrebbero alcuni fan degli spazi bianchi, ovvero spazi o schede invisibili? ottimo per dati non nidificati in modo approfondito.

— Jason Sebring,

124

Dai nomi di proprietà / chiavi oggetto non quotati in JavaScript , il mio articolo sull'argomento:

Le virgolette possono essere omesse solo se il nome della proprietà è un valore letterale numerico o un nome identificativo valido .

[...]

La notazione parentesi può essere tranquillamente utilizzata per tutti i nomi di proprietà.

[...]

La notazione a punti può essere utilizzata solo quando il nome della proprietà è un nome identificativo valido.

Si noti che le parole riservate possono essere utilizzate come nomi di proprietà non quotati in ES5. Tuttavia, per la retrocompatibilità con ES3, suggerirei comunque di citarli.

Ho anche creato uno strumento che ti dirà se un dato nome di proprietà può essere usato senza virgolette e / o con notazione punto. Provalo su mothereff.in/js-properties .

— Mathias Bynens
fonte

Questo strumento è stato un salvavita. Grazie per aver pubblicato questo

— Chris Christensen,

Stavo andando giù da una scogliera, sul punto di cadere su una pendenza molto ripida, precipitandomi verso una morte certa, totale, sanguinolenta; ma ahimè, ho cliccato un link nella tua risposta, che conteneva un semplicissimo strumento JS, che mi ha impedito di cadere da quella scogliera. Questo strumento è stato un salvavita.

— Andrew,

8

Non c'è differenza qui. Solo una questione di stile. Uno dei motivi per farlo è la possibilità di utilizzare "super" o "classe" come chiave poiché si tratta di parole chiave riservate.

Alcune persone potrebbero essere tentate di passare una stringa con spazi bianchi, quindi chiamare o ['I have have whitespace'] Ma definirei questa cattiva pratica.

— Raynos
fonte

3

No, non per JavaScript. Tuttavia, alcuni parser JSON falliranno quando le virgolette intorno alle chiavi non sono presenti.

— 01001111
fonte

35

Le chiavi senza virgolette non sono valide in JSON.

— Ned Batchelder,

1

Ci sono alcune situazioni in cui sono diverse. Ad esempio, se si utilizza jQuery e si crea un elenco di parametri da passare quando si chiama il comando jQuery $ () per creare un elemento, le parole tra virgolette vengono trasformate in parametri e le parole senza virgolette vengono trasformate in funzioni. Ad esempio, "size" imposterà l'attributo size dell'oggetto e size (senza virgolette) chiamerà la funzione size () sull'oggetto. Vedi jQuery () , nella parte inferiore:

Mentre il secondo argomento è conveniente, la sua flessibilità può portare a conseguenze non intenzionali (ad esempio $ (" <input>", {size: "4"}) chiamando il metodo .size () invece di impostare l'attributo size). Il blocco di codice precedente potrebbe quindi essere scritto come:

— spekary
fonte

Non credo che questo esempio dica ciò che pensi che dica. Il problema che hai citato è perché jQuery ha un metodo chiamato size e il conflitto tra la dimensione del metodo e la dimensione dell'attributo viene risolto selezionando il metodo. Ci sono casi in jQuery in cui il passaggio di un valore come stringa o altro tipo provoca un cambiamento nel comportamento, ma mai dalla definizione di una proprietà con un nome di proprietà valido tra virgolette e non tra virgolette.

— Alex Weitzer,