Javascript add object to an oustide array in a loop

Question

I'm trying to add dynamically created Javascript object to an array. I could traverse the DOM & creating the objects. But when displaying the final array of Objects, the count is correct but all objects are of same value ie, final index value. How to get rid of this problem?

PS: DOM traversal & other functionalities work well & only problem with creating the final array of objects with correct values.

Javascript Code.

var match = {};

var matches = [];

$('.SIsort').each(function (i, v) {
      console.log("type.."+typeof matches);
      var date = $(this).find('td:eq(0)').find('meta')[0].content;
      var team1 = $(this).find('td:eq(1)').find('div:eq(1)').text();
      var team2 = $(this).find('td:eq(1)').find('div:eq(3)').text();
      var loc = $(this).find('td:eq(2)').find('div:eq(0)').text();

      match.date = date;
      match.team1 = team1;
      match.team2 = team2;
      match.venue = loc;

      console.log(match); // It displays Correctly

      (matches = window.matches || []).push({});
      matches = (window.matches || []).push(match);
     // console.log(matches[i])

});

console.log(matches); // All object values belong only to final index

T.J. Crowder · Accepted Answer · 2015-10-03 12:30:24Z

You're repeatedly pushing the same object into the array.

Move your

var match = {};

...line into the loop so that you create a new object each time.

Also, I'm not sure what you're trying to achieve with this:

(matches = window.matches || []).push({});
matches = (window.matches || []).push(match);

But you just want:

matches.push(match);

Here's a minimal example of what you're doing:

var match = {};
var i;
for (i = 0; i < 5; ++i) {
    match.i = i;         // Overwrites the previous `i` value on subsequent loops
    matches.push(match); // Pushes the *same object* onto the array
}
console.log(matches);    // Shows the same object, all with `i = 4`

Instead, create a new object each time:

var i;
for (i = 0; i < 5; ++i) {
    var match = {};     // Creates a new object
    match.i = i;
    matches.push(match);
}
console.log(matches);

Applying that to your code:

var matches = [];

$('.SIsort').each(function (i, v) {
      console.log("type.."+typeof matches);
      var date = $(this).find('td:eq(0)').find('meta')[0].content;
      var team1 = $(this).find('td:eq(1)').find('div:eq(1)').text();
      var team2 = $(this).find('td:eq(1)').find('div:eq(3)').text();
      var loc = $(this).find('td:eq(2)').find('div:eq(0)').text();

      var match = {};
      match.date = date;
      match.team1 = team1;
      match.team2 = team2;
      match.venue = loc;

      console.log(match); // It displays Correctly

      matches.push(match);
});

console.log(matches);

Side note: These lines:

var match = {};
match.date = date;
match.team1 = team1;
match.team2 = team2;
match.venue = loc;

console.log(match); // It displays Correctly

matches.push(match);

can be combined into:

var match = {
    date: date,
    team1: team1,
    team2: team2,
    venue: loc
};

console.log(match); // It displays Correctly

matches.push(match);

Arkantos · Accepted Answer · 2015-12-10 17:33:51Z

0

The problem with your code is that you're creating only ONE instance of match outside of your loop and updating the same object in each iteration before adding it to your Array. Actually you're supposed to create a NEW object, every time you want to add an entry to your loop, so create a new object at the starting of the loop like below.

var matches = [];

$('.SIsort').each(function (i, v) {
   var match = {};
   // update match object and add to array
   matches.push(match);
}

That should do it :)

edited Dec 10, 2015 at 17:33

answered Oct 3, 2015 at 12:34

Arkantos

6,6083 gold badges19 silver badges38 bronze badges

Collectives™ on Stack Overflow

Javascript add object to an oustide array in a loop

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related