Set object key to dynamic value in JavaScript

Question

I'm looping through a jQuery selector and trying to assign values of form elements to a container variable that can then be passed along to further actions as JSON.

Say there's three groups of checkboxes, each in their own div, named group1, group2 and group3.

This is psuedo-code, but something like this:

var data = {};
var groups = {
    'group1': obj with a bunch of key val pairs for checkboxes,
    'group2': another obj,
    'group3': and another obj
 }; // these define divs / groups of checkboxes

// create all the checkboxes and divs from the groups object somewhere in here

//now build a function to loop over the groups and get any checked boxes
function getInputs(){
    $.each(groups, function(index, el) {
        // this is where I am stuck
        data.index = $('#' + index + ' input:checked'); // <-- how to do this?
    });
}

So essentially I want to add the values of the checked items to the proper item in the data object-- eg. If we're looping over the group1 div, then the checkboxes for each group will be added to data.group1, data.group2 etc.

How do I make data.index evaluate as data.group1?

possible duplicate of [How to create object property from variable value in javascript?](http://stackoverflow.com/questions/2241875/how-to-create-object-property-from-variable-value-in-javascript) or [How to set a Javascript object values dynamically?](http://stackoverflow.com/q/6439915/615754) — nnnnnn, Nov 05 '12 at 23:13

score 7 · Accepted Answer · answered Nov 05 '12 at 22:48

7

As simple as:

data[index]

.......

answered Nov 05 '12 at 22:48

zerkms

249,484
69
436
539

Why not `eval("data." + index)`? ;) – alex Nov 05 '12 at 22:54
@alex: it's only allowed to real js ninjas ;-) – zerkms Nov 05 '12 at 22:57
I think what **Julio** wants is `data["group"+index]`. @Alex, eval's use is dangerous in nature as it'll execute beyond your requirements. Example: `var index = "group1; alert('go **** yourself')"; eval("data." + index);` (sorry for being so blunt :)) Now you could go ahead and use it if you can ensure the input won't have harmful code, but why expose yourself to such risk if there is a safer alternative? – cbayram Nov 05 '12 at 23:06
Nice trolling @alex :) One real reason not to use eval, even in cases like this where the input is known and safe, is that it's slowwww. – nickf Nov 05 '12 at 23:14
@cbayram: I'm sure the person with 120k reputation (most of which is from javascript badge) knows that ;-) – zerkms Nov 05 '12 at 23:14
@zerkms Perhaps the answer should be `data['group' + (index + 1)]` – nickf Nov 05 '12 at 23:15
@nickf: let's left it as a small task for the OP ;-) – zerkms Nov 05 '12 at 23:16
@cbayram and nickf - `data[index]` is correct because `index` will already be `"group1"`, `"group2"`, etc. - the OP's code is iterating through object properties, not through array elements. (The `index` parameter would be less misleading if it were named `key`.) – nnnnnn Nov 05 '12 at 23:18
@zerkms, I didn't catch on. Good to see some humor and trolling though, just the precedence I was looking for lol. – cbayram Nov 05 '12 at 23:26
@Alex—because he wants his pets to live. – RobG Nov 06 '12 at 02:20

score 0 · Answer 2 · answered Jan 16 '18 at 11:00

If you're able to use ES6 JavaScript features, you can use Computed Property Names to handle this very easily:

var request = {id : 1236};
var responseMessage = 'The response message';

var resp = {responses: {[request.id]: responseMessage}};

The [request.id] object key has a dynamic value

Set object key to dynamic value in JavaScript

2 Answers2