How do I interpolate a variable as a key in a JavaScript object?

Question

How can I use the value of the variable a as a key to lookup a property? I want to be able to say: b["whatever"] and have this return 20:

var a = "whatever"; var b = {a : 20}; // Want this to assign b.whatever alert(b["whatever"]); // so that this shows 20, not `undefined`

I am asking if it's possible during the creation of b, to have it contain "whatever":20 instead of a:20 where "whatever" is itself in a variable. Maybe an eval could be used?

possible duplicate of How to create a dynamic key to be added to a javascript object variable. and pass variable into javascript object and probably others... — Felix Kling
– Felix Kling, Commented Apr 12, 2011 at 20:25
I'm guessing when you say "interpolate," you mean "use." Just so it doesn't cause you problems in the future, interpolate means "estimate unknown values between known values" and doesn't fit in this question title at all. — foobarbecue
– foobarbecue, Commented Feb 3, 2015 at 15:26
No, he's using correct terminology. You're referring to interpolation in the field of mathematics. en.wikipedia.org/wiki/Interpolation He's referring to interpolation in the field of computer science. en.wikipedia.org/wiki/String_interpolation. :-) — Aaron Gray
– Aaron Gray, Commented Jul 23, 2015 at 23:21
I think stackoverflow.com/questions/6500573/… asks the same thing but formulated in a different way, neither of them in a particularly wrong way. — conny
– conny, Commented Apr 17, 2018 at 16:22

user5185876 · Accepted Answer · 2015-08-03 13:35:36Z

64

This works in Firefox 39 and Chrome 44. Don't know about other browsers. Also it doesn't work in nodejs v0.12.7.

var a = "whatever"; var b = { [a]: 20 }; console.log(b["whatever"]); // shows 20

That is, to interpolate a variable, enclose it in brackets.

I'm not sure if this is a part of any standard. Originally, I saw such syntax here: https://hacks.mozilla.org/2015/07/es6-in-depth-classes/ where the author defined:

[functionThatReturnsPropertyName()] (args) { ... }

I'm also not sure if you should use that syntax. It's not widely known. Other members on your team might not understand the code.

answered Aug 3, 2015 at 13:35

user5185876

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

5 Comments

Carl Walsh Over a year ago

Javascript syntax support is more important that just code readability. It matters that the user's browser doesn't fail! The syntax is part of the upcoming ECMAScript 6, and it's only supported in very recent browsers: kangax.github.io/compat-table/es6/#object_literal_extensions

Kostanos Over a year ago

v4.2.6 also supports it

tpartee Over a year ago

Totally the right answer for those who can use ES6, shame some browsers do not yet even in 2018. This solution is better than the accepted answer here as it provides more legible and concise code.

Elle Mundy Over a year ago

This is a great answer, because it allows you to construct the object in one statement, which plays nicely with one-line arrow functions with parentheses

Anirudh Ramanathan Over a year ago

This should be safe to use at this point in time unless you're looking to support IE.

mVChr · Accepted Answer · 2011-04-12 20:11:21Z

56

var a = "whatever"; var b = {}; b[a] = 20; alert(b["whatever"]); // shows 20

answered Apr 12, 2011 at 20:11

mVChr

50.3k11 gold badges111 silver badges105 bronze badges

1 Comment

tpartee Over a year ago

Disagree that this is a poor answer on the merit of the code and answering the OP's question. Agree that it could be better by adding some supporting text to explain why what the OP wants to do doesn't simply work in JS and some reasoning behind the answer's operation. Supporting citations would also be a welcome addition. But this is a solid solution pre-ES6.

gen_Eric · Accepted Answer · 2011-04-12 20:10:37Z

var a = "whatever"; var b = {a : 20}; b[a] = 37; alert(b["whatever"]); // 37

'a' is a string with the value 'a'. a is a variable with the value 'whatever'.

rashadb · Accepted Answer · 2015-06-05 03:47:20Z

Great question. I had a time trying to figure this out with underscore but the answer couldn't be more simple:

var a = "whatever"; var b = {a : 20}; var array = [a, b] var answer = _.object([[array]])// {whatever: {a:20}}//NOTICE THE DOUBLE SET OF BRACKETS AROUND [[array]]

I hope this helps!

Peter Mortensen · Accepted Answer · 2016-03-15 23:05:50Z

2

Try this:

var a = "whatever"; var c = "something"; var b = {whatever : 20, something: 37}; alert(b[a]); // Shows 20 alert(b[c]); // Shows 37

Here is the fiddle.

Or if I understand from the below comments correctly, try this:

var a = "whatever"; var b = {a : 20}; alert(b.a); // Shows 20

edited Mar 15, 2016 at 23:05

Peter Mortensen

31.4k22 gold badges110 silver badges134 bronze badges

answered Apr 12, 2011 at 20:09

Naftali

147k41 gold badges247 silver badges304 bronze badges

7 Comments

Geo Over a year ago

But there's no way to directly initialise it? We have to do it like this?

Geo Over a year ago

I was thinking that maybe there is a way to make it "dereference" it somehow and not consider it a string. Why is this the default behaviour in js?

Naftali Over a year ago

@Geo i believe that might be another question you might want to ask, im not sure

Naftali Over a year ago

@Felix -- @Rocket also seems about the same answer

bendman Over a year ago

The update is wrong, b.a is parsed as b['a'] not b['whatever']

|

Benny Neugebauer · Accepted Answer · 2016-09-07 13:10:30Z

To show all options, I want mention the CoffeeScript way of doing this, which is:

var a = "whatever"; var b = ( obj = {}, obj["" + a] = 20, obj ); alert(b.whatever); // 20

Although I prefer:

var a = "whatever"; var b = {}; b[a] = 20; alert(b.whatever); // 20

Collectives™ on Stack Overflow

How do I interpolate a variable as a key in a JavaScript object?

6 Answers 6

5 Comments

1 Comment

Comments

1 Comment

7 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

5 Comments

1 Comment

Comments

1 Comment

7 Comments

Comments

Linked

Related