Confusion on Javascript Object's dot method

Question

In Javascript, all keys in a property are strings, right? So, in other word,

this code:

var object = {
car: 'tesla'
};

and this code are same:

var object = {
'car': 'tesla'
};

But why is it so that I can access the key car using : object["car"] but not using this: object[car]

In other words, why do I need to put the key named car around quotes if the key named car has already been turned into a string?

I read this thread but couldn't manage to get a clear answer on this particular issue. Hope someone helps.

Presumably, it's a typo since the OP means to compare dot notation with bracket notation. — canon
– canon, Commented Mar 23, 2020 at 16:27
You want to know why you have to use quotes in bracket notation and not in dot notation? — epascarello
– epascarello, Commented Mar 23, 2020 at 16:27
Because in bracket notation car is a variable "car" is a string. var foo = 'car'; var data = object[foo] — epascarello
– epascarello, Commented Mar 23, 2020 at 16:28
Related questions: What is the difference between object keys with quotes and without quotes?, JavaScript property access: dot notation vs. brackets? — Heretic Monkey
– Heretic Monkey, Commented Mar 23, 2020 at 16:32

Quentin · Accepted Answer · 2020-03-23 16:27:50Z

4

Inside an object initializer, an identifier is treated as a property name.

The value used in bracket notation property accessors is an expression.

If you use an identifier in an expression, it is treated as a variable name.

Since you can use any expression in bracket notation, you can dynamically generate the value:

object[function_that_returns_car(argument_from_local_scope)]

object[`string with ${interpolated} value`]

object[i_from_for_loop]

… which is what makes bracket notation useful.

Compare to dot notation where you must use an identifier and that identifier is treated as the property name directly:

object.car

answered Mar 23, 2020 at 16:27

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

slevin Over a year ago

I lacked the knowledge that identifiers are treated as variable when they are placed inside a property accessor. Thanks for enlightening me. Will you please have a look at this snap: snipboard.io/Tl4Sie.jpg In the above snap, 12 was treated as a property name inside the bracket notation, directly, whether if I used quotation or not; since 12 is not a valid identifier, correct?

Quentin Over a year ago

@slevin — That's bracket notation, not dot notation, and no, 24 isn't an identifier, it is a number literal (which gets converted, implicitly, to the string "24" in string context)

slevin Over a year ago

You are right. But since 12 gets converted to "12", implicitly, and then when I use the bracket notation i.e., object["12"], to call the key named 12, doesn't it look something like this: object[" " 12" "]? I mean, 12 just got converted to "12." So when you are using an additional quotation, doesn't it look like object[""12""] inside the bracket notation?

Quentin Over a year ago

No. It gets converted from the number 12 to the string 12 and everything else is just syntax that only has meaning in source code.

Collectives™ on Stack Overflow

Confusion on Javascript Object's dot method

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related