For Loop Appending Object Multiple Times in Javascript

Question

I have the following code.

const timeLabels = [
    { name: "1:00 AM", present: true, label: ["1:00", "2:00"], value: "1:00" },
    { name: "2:00 AM", present: true, label: ["2:00", "3:00"], value: "2:00"},
    { name: "3:00 AM", present: true, label: ["3:00", "4:00"], value: "3:00" },
];

const targetedTimes = [["0:00", "1:00"], ["1:00", "2:00"]]
  
    let actualTime = [];

    console.log("getting time");
    console.log("start: the actualTime is", actualTime);
    for (var j = 0; j < timeLabels.length; j++) {
        console.log("x");
        var currItem = timeLabels[j];
        var label = JSON.stringify(currItem.label);
        var adTime = JSON.stringify(targetedTimes);
        if (adTime.indexOf(label) >= 0) {
            currItem.present = true;
        } else {
            currItem.present = false;
        }
        console.log("the current item is", currItem);
        actualTime.push(currItem);
        console.log("The actual time is", actualTime);
    }

On the FIRST iteration, the currItem is

{name: "1:00 AM", present: true, label: Array(2), value: "1:00"}

But the actualTime is

   [{name: "1:00 AM", present: true, label: Array(2), value: "1:00"}, 
   {name: "2:00 AM", present: false, label: Array(2), value: "2:00"},
   {name: "3:00 AM", present: false, label: Array(2), value: "3:00"}]

Why would the actualTime list have three values when I only append 1 on the first iteration?

Wait, what about the console.log before the for-loop? What does it log? — Zeke
– Zeke, Commented Oct 29, 2017 at 3:28
@HyperNeutrino can you elaborate why when I console.log the currItem it shows 1 item, but when I actually push it to the list, it appends 3 items on the first iteration? — lost9123193
– lost9123193, Commented Oct 29, 2017 at 3:30
@lost9123193 Well you see it's not appending three items on the first iteration, that's the last iteration (console.log might be collapsing the similar items, I don't know). — hyperneutrino
– hyperneutrino, Commented Oct 29, 2017 at 3:31
@HyperNeutrino hmm i'm not sure if that makes sense, the console.log is IN the for loop, so it should show all iterations. On it's first loop I get the issue I've shown above. — lost9123193
– lost9123193, Commented Oct 29, 2017 at 3:33

Sami El Maameri · Accepted Answer · 2017-10-29 16:41:49Z

1

What is happening is that the console is printing a reference to the object (becuase arrays are a type of object in javascript), so by the time you print it and read it in the console, each console.log statement is pointing at the same final array, which is why the values is the same each time.

Have a look at this similar StackOverflow question for more insight.

I tried running your script on node and it printed out the array correctly on each iteration, with only one item in the first iteration, so your code is fine.

answered Oct 29, 2017 at 16:41

Sami El Maameri

3791 gold badge8 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

For Loop Appending Object Multiple Times in Javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related