Dynamic keys in Javascript associative array declaration one-liner

Question

I would expect the following three associative arrays to be identical:

arr1 = { "dynamic":"foo", "bar":"baz" };

key = "dynamic";    
arr2 = { key:"foo", "bar":"baz" };

arr3 = {};
arr3[key] = "foo";
arr3["bar"] = "baz";

In the above examples, arr1 and arr3 are the same, but arr2 is different.

Is it possible to use dynamic keys in the declaration of a javascript associative array?

No you cannot use variables as keys in an object literal declaration. — Musa, Jul 24 '13 at 17:09
[N](http://stackoverflow.com/q/6500573/1048572)[o](http://stackoverflow.com/q/4071499/1048572) — Bergi, Jul 24 '13 at 17:30
duplicate of [Using a variable for a Javascript object key](http://stackoverflow.com/questions/2274242/using-a-variable-for-a-javascript-object-key) (and many others) — Bergi, Jul 24 '13 at 17:38

score 20 · Accepted Answer · answered Aug 03 '17 at 15:26

20

It is now possible to use dynamic keys in the declaration of a javascript object, in any browser/platform that supports ES6 literal shorthands:

key = "dynamic";    
arr2 = {
    [key]: "foo",  // "dynamic": "foo"
    "bar": "baz"
};

answered Aug 03 '17 at 15:26

Brian

7,394
3
25
46

score 9 · Answer 2 · answered Jul 24 '13 at 17:08

Only the [] syntax works for dynamic keys. You cannot use them in a literal. So your answer is no, it's not possible.

But you can use a literal to create all the static keys and then add the dynamic ones using the [] syntax. That's usually prettier than using the . or [] notation for all elements.

score 7 · Answer 3 · edited May 23 '17 at 12:09

7

I found a solution for this.

Do as following:

var field='name';

var ourVar={};

ourVar[field] = 'Somethig';

Source: Javascript: variable as array key

edited May 23 '17 at 12:09

Community

1
1

answered Dec 31 '13 at 08:01

Ramasamy Kasi

171
3
3

score 1 · Answer 4 · answered Jan 10 '14 at 10:48

1

Since you asked for a one liner, try this:

var key = 'dynamic', obj = (function(o) { o[key]='foo'; return o;})({bar: 'baz'});

This will make obj equal to {bar: "baz", dynamic: "foo"}

answered Jan 10 '14 at 10:48

Phil M

975
1
9
13

score 0 · Answer 5 · answered May 01 '20 at 21:11

0

var originalObj = {};//some data here


function addKeyValuePair(originalObj,key,value){
    originalObj = {...originalObj,[key]:value}
};

answered May 01 '20 at 21:11

Vladimir Monsanto

532
5
13

Dynamic keys in Javascript associative array declaration one-liner

5 Answers5