Pushing an associative array onto each value of another array in Javascript

Question

Let's say I have the following JavaScript array:

var mainArray = ["thing1", "thing2", "thing3"];

And for each of these array elements, I want to add an associative array, so that it looks something like this:

var mainArray = [
  "thing1" {
    key1 => value1,
    key2 => value2,
    key3 => value3
  },
  "thing2" {
    key4 => value4,
    key5 => value5,
    key6 => value6
  },
  "thing3" {
    key7 => value7,
    key8 => value8,
    key9 => value9
  }
];

How would I push each associative array onto each element of mainArray?

Answer 1

I believe you want an object containing objects.

var myObj = {
  "thing1": {
    "key1": "someValue",
    "key2": "someValue"
  },
  "thing2": {
     // etc
  }
};

alert(myObj.thing1.key1);

Answer 2

Using JavaScript forEach array method:

JSFiddle here.

var mainArray = ["thing1", "thing2", "thing3"]

var mainObj = {};
mainArray.forEach(function(curr, ii) {
    mainObj[curr] = { 'key1': 'value' + (ii * 3 + 1), 'key2': 'value' + (ii * 3 + 2), 'key3': 'value' + (ii * 3 + 3) }
})
console.log(mainObj)

Outputs:

{
    "thing1": { "key1": "value1", "key2": "value2", "key3": "value3" },
    "thing2": { "key1": "value4", "key2": "value5", "key3": "value6" },
    "thing3": { "key1": "value7", "key2": "value8", "key3": "value9" }
}

And can be accessed by mainObj.thing1

---

Alternatively, using JavaScript map method:

Another JSFiddle here.

var mainArray = ["thing1", "thing2", "thing3"]

var newArray = mainArray.map(function(curr, ii) {
    var obj = {}
    obj[curr] = { 'key1': 'value' + (ii * 3 + 1), 'key2': 'value' + (ii * 3 + 2), 'key3': 'value' + (ii * 3 + 3) }
    return obj
})
console.log(newArray)

Outputs:

[
    { "thing1": { "key1": "value1", "key2": "value2", "key3": "value3" } },
    { "thing2": { "key1": "value4", "key2": "value5", "key3": "value6" } },
    { "thing3": { "key1": "value7", "key2": "value8", "key3": "value9" } }
]

However map only returns an array. Therefore accessing elements would be like newArray[0].thing1 which I think is odd.

---

Or if you are wanting to simply weave them together:

JSFiddle weave.

var mainArray = ["thing1", "thing2", "thing3"]

var newArray = [];
mainArray.forEach(function(curr, ii, arr) {
    newArray.push(curr,
               { 
                   'key1': 'value' + (ii * 3 + 1), 
                   'key2': 'value' + (ii * 3 + 2), 
                   'key3': 'value' + (ii * 3 + 3) 
               }
    );
})
console.log(newArray)

Outputs:

[ 
    "thing1", { "key1": "value1", "key2": "value2", "key3": "value3" },
    "thing2", { "key1": "value4", "key2": "value5", "key3": "value6" },
    "thing3", { "key1": "value7", "key2": "value8", "key3": "value9" }
]

Answer 3

You can do it like that:

var mainArray = {"thing1":{}, "thing2":{}, "thing3":{}};
mainArray.thing1[key1]=value1;
mainArray.thing1[key2]=value2;

I added only 2 values, but you can add as much as you need.

Answer 4

JavaScript associative arrays are really just objects. You can use something like the following to create an array of associative arrays,

function createObject(key1, var1, key2, var2, key3, var3) {
    var newobj = {};
    newobj[key1] = var1;
    newobj[key2] = var2;
    newobj[key3] = var3;
    return newobj;
}

var a1 = [];
a1.push(createObject("var1", "a", "var2", "b", "var3", "c"));
a1.push(createObject("var4", "d", "var5", "e", "var6", "f"));
alert(a1[1].var4);
alert(a1[1]["var4"]);
alert(a1[0].var3);
alert(a1[0]["var3"]);

This will alert "d" twice and then "c" twice.

Answer 5

Here's my attempt:

function objectify(keys, values){
    return keys.reduce(function(obj, key, i){
        obj[key] = values[i];
        return obj
    }, {});
}

Example call:

objectify(
    ['a','b','c'],
    [{k:1, l:2, m:3},{k:4, l:5, m:6},{k:7, l:8, m:9}]
);

Demo on JSFiddle