Difference Between Object Keys With Quotes and Without Quotes

What is the difference between object keys with quotes and without quotes?

No, the quotes do not make a difference (unless, as you noted, you want to use a key that’s not a valid JavaScript identifier).

As a side note, the JSON data exchange format does require double quotes around identifiers (and does not allow single quotes).

Javascript Object Attribute With/Without quotes

They are equivalent in your case.

Internally, they are the same.

What could change is the way you can access them with your code.

When using strings (quoted properties), you can actually use more exotic names for your properties :

var obj3 = {
    "attribute with space": 1,
    "123AttributeStartingWithANumber": 1,
}

In my example, you cannot access those attribute names via the obj1.attributeName syntax (but you can with the brackets notations : obj1["attribute with space"] or obj1["123AttributeStartingWithANumber"] .

This is because "attribute with space" or "123Attribute" are not valid identifiers in JS.

Note that in your example you can also use the bracket notation :

console.log(obj1["attribute1"]);
console.log(obj2["attribute1"]);

---

In summary, to quote deceze's comment :

Quoted properties and bracket notation always work, unquoted
properties and . dot access is shorthand for when your property name
is a valid identifier.

JS object keys with or without quotes?

Don't confuse JSON object and Javascript object literal. JSON object is basicly just a string and its syntax requires to have proper quotes. However for javascript object quotes around its properties are not necessary. But in some cases you have to use them, e.g:

var test = {
    "with spaces": 12
}

What's the difference of JSON Key to be surrounded with double quote and no double quote at all?

According to the JSON specs (see http://json.org) you have to surround the keys with double quotes.

A JSON object contains a set of string/value pairs, and strings are defined as follows:

A string is a sequence of zero or more Unicode characters, wrapped in double quotes, using backslash escapes.

That is so you can use reserved keywords as keys, as in

{
    "function": "sqrt"
}

Basically, "JSON" code where the key is not surrounded by double quotes is not valid JSON.

Should Javascript Objects keys be quoted in?

Short Answer: JavaScript object keys do not need to be surrounded by quotes.

Because:

JSON and the object literal syntax in JavaScript are different things, although they are closely related.

JSON has to be transmitted as a string between the server and the client. Because of this, all the values need to be wrapped in "" so they can be tokenized, split, and reconstructed back into objects when they arrive.

The javascript literal syntax does not have to go through this transfer, and so the quotes are not necessary. Convention dictates that you do not use quotes unless the key has a space or is a special reserved word.

What's difference between keys with and without quotes in object literal

In the object initializer syntax, keys can be numeric literals, identifiers, or strings.

var obj1 = {
    1e9: "123" //valid because it's a numeric literal
}

var obj2 = {
    $_ASd: "123" //Valid because it's a valid identifier I.E. you could make a variable called $_Asd
}

var obj3 = {
    $ hello world: "123" //invalid because it's not an identifier, I.E. you could not make a variable called $ hello world
}

var obj4 = {
    '$ hello world': "123" //valid because it's a valid string
}

After that the key is turned into a string regardless of what it was in the syntax, so in the case of 1e9 the key will be a string "1000000000".

What is the difference between giving character with quotes as key and just character as key of property of an object in javascript

Regarding your first question: there is no difference between your 1st and 2nd example.

For your second question, let's look at this small example:

charCount = { a: 2, b:3 }
char = 'a'
print(charCount[char]) // 2
print(charCount.char) // error

As pointed out in the comment, when you call charCount[char], it will dynamically access object property using variable. What it does is just simply replace the variable char with its current value (which is a in this case). So, the call becomes charCount['a'], and you got the result.

When you call charCount.char, it literally tries to access the property named char of the object charCount. In this case, that property does not exist, which is why you got an error.

---

Related Topics