Qual é a diferença entre chaves de objeto com aspas e sem aspas?

209

Existe alguma diferença entre

obj = {'foo': 'bar'}

e

obj = {foo: 'bar'}

Percebi que você não pode usar -a chave quando não uso as aspas. Mas isso realmente faz diferença? Se sim, qual?

javascript meo
fonte

Respostas:

136

Não, as aspas não fazem diferença (a menos que, como você observou, você queira usar uma chave que não seja um identificador JavaScript válido).

Como uma nota lateral, o formato de troca de dados JSON faz requer aspas em torno identificadores (e que não permitem que as aspas simples).

bdukes
fonte
88
Na verdade, as aspas podem fazer a diferença se você usar um literal numérico como um nome de propriedade. Por exemplo, obj = { 12e34: true };não é o mesmo que obj = { '12e34': true };. O primeiro exigiria o acesso à propriedade obj['1.2e+35'], enquanto o último você usaria obj['12e34']. Veja minha resposta para mais detalhes.
Mathias Bynens 6/03/12
1
É verdade, mas seria brilhante se as aspas duplas fossem opcionais, com um primeiro caractere + alfanumérico e alguns fãs de espaço em branco também conhecido como abas ou espaços invisíveis? ótimo para dados não profundamente aninhados.
Jason Sebring
124

Em Nomes de propriedades não citados / chaves de objeto em JavaScript , minha redação sobre o assunto:

As cotações só podem ser omitidas se o nome da propriedade for um literal numérico ou um nome de identificador válido .

[...]

A notação de colchete pode ser usada com segurança para todos os nomes de propriedades.

[...]

A notação de ponto pode ser usada apenas quando o nome da propriedade é um nome de identificador válido.

Observe que palavras reservadas podem ser usadas como nomes de propriedades não citadas no ES5. No entanto, para compatibilidade retroativa com o ES3, sugiro citá-los de qualquer maneira.

Também criei uma ferramenta que informa se qualquer nome de propriedade pode ser usado sem aspas e / ou com notação de ponto. Experimente em mothereff.in/js-properties .

Captura de tela

Mathias Bynens
fonte
Esta ferramenta foi um salva-vidas. Obrigado por postar isso.
Chris Christensen
Eu estava saindo de um penhasco, prestes a cair em uma ladeira muito íngreme, fugindo em direção a uma morte certa, completa e sangrenta; mas, infelizmente, cliquei em um link na sua resposta, que tinha uma ferramenta JS muito simples, o que me impediu de cair daquele penhasco. Esta ferramenta foi um salva-vidas.
19419 Andrew
8

Não há diferença aqui. Apenas uma questão de estilo. Uma das razões para fazer isso é poder usar 'super' ou 'classe' como chave, pois são palavras-chave reservadas.

Algumas pessoas podem ficar tentadas a passar uma cadeia de caracteres com espaço em branco e então chamar o ['I can have white space']. Mas eu chamaria isso de má prática.

Raynos
fonte
3

Não, não para javascript. No entanto, alguns analisadores JSON falharão quando as aspas ao redor das chaves não estiverem presentes.

01001111
fonte
35
Chaves sem aspas são inválidas em JSON.
Ned Batchelder
1

Existem algumas situações em que são diferentes. Por exemplo, se você estiver usando o jQuery e estiver fazendo uma lista de parâmetros a serem transmitidos ao chamar o comando jQuery $ () para criar um elemento, as palavras entre aspas serão transformadas em parâmetros e as palavras não entre aspas serão transformadas em funções. Por exemplo, "size" definirá o atributo size do objeto e size (sem aspas) chamará a função size () no objeto. Veja jQuery () , na parte inferior:

Embora o segundo argumento seja conveniente, sua flexibilidade pode levar a consequências não intencionais (por exemplo, $ (" <input>", {size: "4"}) chamando o método .size () em vez de definir o atributo size). O bloco de código anterior poderia, portanto, ser escrito como:

spekary
fonte
Não acho que esse exemplo diga o que você pensa. O problema que você citou é porque o jQuery possui um método chamado size, e o conflito entre o tamanho do método e o tamanho do atributo é resolvido selecionando o método. Existem casos no jQuery em que a passagem de um valor como uma sequência ou outro tipo causa uma alteração no comportamento, mas nunca é necessário definir uma propriedade com um nome de propriedade válido entre aspas e não entre aspas.
Alex Weitzer