My goal is to create an array like this:

[{"str":"a","number":1},{"str":"a","number":2},{"str":"b","number":1},{"str":"b","number":2}]

so I wrote this javascript

abc = ["a","b"]
num = [1,2]
arr = []
a = {}
for (var i in abc)
    {
    str = abc[i]
    a.str = str;
    for(var x in num)
        {
        number = num[x]
        a.number = number
        console.log(a)
        arr.push(a)
        }
    }

the console log looks fine, but the array looks like this:

[{"str":"b","number":2},{"str":"b","number":2},{"str":"b","number":2},{"str":"b","number":2}]

Can anyone could explain this?

My goal is to create an array like this:

[{"str":"a","number":1},{"str":"a","number":2},{"str":"b","number":1},{"str":"b","number":2}]

so I wrote this javascript

abc = ["a","b"]
num = [1,2]
arr = []
a = {}
for (var i in abc)
    {
    str = abc[i]
    a.str = str;
    for(var x in num)
        {
        number = num[x]
        a.number = number
        console.log(a)
        arr.push(a)
        }
    }

the console log looks fine, but the array looks like this:

[{"str":"b","number":2},{"str":"b","number":2},{"str":"b","number":2},{"str":"b","number":2}]

Can anyone could explain this?

• javascript
• jquery

Share Improve this question Follow edited Jun 2, 2017 at 12:08 Frits 7,6241010 gold badges4747 silver badges6565 bronze badges asked Jun 2, 2017 at 11:50 Shin-Bang TsaiShin-Bang Tsai 1,10311 gold badge88 silver badges1010 bronze badges 1

• 1 There's only one object involved; your code updates that one object and pushes it into the array many times. You'll have to create a new value for a on each iteration if you want different objects. Also, declare your variables with var or let. – Pointy Commented Jun 2, 2017 at 11:53

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 5

This is happening because you are actually working with a reference to the same object, thus modifying the same over and over.

To fix it you must declare a new object in every iteration you want to use a different one.

Try something like this:

var abc = ["a", "b"];
var num = [1, 2];
var arr = [];

for (var i in abc) {
  for (var x in num) {
    var a = {};
    a.str = abc[i];
    a.number = num[x];
    arr.push(a);
  }
}

console.log(arr);

Also, don't forget to declare your variables with var or let and end your statements with ;.

As said in the ments, you’ve pushed your a object to arr many times, instead of adding four separate objects. To fix this issue, you could declare a in the for (var x in num) loop, every time as a new object (using const or let). But I’ve simplified it further, see the code below.

To iterate through JavaScript arrays, you should use .forEach method.

let abc = ['a', 'b'];
let num = [1, 2];
let arr = [];

abc.forEach(letter => {
  num.forEach(number => {
    arr.push({number: number, str: letter});
  });
});

abc = ["a","b"]
num = [1,2]
arr = []

for (var i in abc)
    {

    for(var x in num)
        {
        a = {} ---------------- Reset "a"
        str = abc[i] --------------------- 1
        a.str = str; --------------------- 2
        number = num[x]
        a.number = number
        console.log(a)
        arr.push(a)
        }
    }

console.log(arr)

// Move 1 and 2 inside the second loop

Using map :

let tempArray = abc.map((e,i) => { return num.map((ee,ii) => { return {"str": e, "number": ee }; } ) });
$.merge(tempArray[0], tempArray[1]);