Creating object with dynamic keys [duplicate]

Question

First off, I'm using Cheerio for some DOM access and parsing with Node.js. Good times.

Heres the situation:

I have a function that I need to create an object. That object uses variables for both its keys and values, and then return that single object. Example:

stuff = function (thing, callback) {   var inputs  = $('div.quantity > input').map(function(){     var key   = this.attr('name')      ,  value = this.attr('value');       return { key : value }   })     callback(null, inputs); } 

It outputs this:

[ { key: '1' }, { key: '1' } ] 

(.map() returns an array of objects fyi)

I need key to actually be the string from this.attr('name').

Whats the best way to assign a string as a key in Javascript, considering what I'm trying to do?

Answer 1

In the new ES2015 standard for JavaScript (formerly called ES6), objects can be created with computed keys: Object Initializer spec.

The syntax is:

var obj = {   [myKey]: value, } 

If applied to the OP's scenario, it would turn into:

stuff = function (thing, callback) {   var inputs  = $('div.quantity > input').map(function(){     return {       [this.attr('name')]: this.attr('value'),     };   })     callback(null, inputs); } 

Note: A transpiler is still required for browser compatiblity.

Using Babel or Google's traceur, it is possible to use this syntax today.

---

In earlier JavaScript specifications (ES5 and below), the key in an object literal is always interpreted literally, as a string.

To use a "dynamic" key, you have to use bracket notation:

var obj = {}; obj[myKey] = value; 

In your case:

stuff = function (thing, callback) {   var inputs  = $('div.quantity > input').map(function(){     var key   = this.attr('name')      ,  value = this.attr('value')      ,  ret   = {};       ret[key] = value;      return ret;   })     callback(null, inputs); }