pushing data into array inside a for loop JavaScript

Question

Could someone give me an explanation as to why this works

itemIds = [];
for (var i = 0; i <= data.length; i++) {
  itemIds.push(data[0].item);
}
console.log(itemIds); // outputs as expected, the same thing, data.length times

But this does not work (the only change is adding i into the push())

itemIds = [];
for (var i = 0; i <= data.length; i++) {
  itemIds.push(data[i].item);
}
console.log(itemIds); // TypeError: Cannot read property 'item' of undefined

I need to do this as data in this example is coming from an angular $http call, and returning an object. I don't understand why statically putting in 0 works, but trying to make it iterate through each data.item does not.

@Endless I don't think that solves the problem of pushing undefined elements into an array. — Phillip Chan
– Phillip Chan, Commented Nov 1, 2016 at 21:13
@Endless I have no idea why, but making that change worked, is there any explanation behind that? Seems very weird to me. — Truextacy
– Truextacy, Commented Nov 1, 2016 at 21:15
putting a breakpoint in your loop would also explain it very well. — user400654
– user400654, Commented Nov 1, 2016 at 21:20

Daniel Hall · Accepted Answer · 2016-11-01 21:22:10Z

4

This is because your variable i will eventually increment above the length of the array.

You need to change your for loop from i <= data.length to i < data.length.

This will ensure that the i variable will always be within the bounds of the array.

Considering that the index is zero-based, but the length will count up from one, the length will always be one more than the highest index.

edited Nov 1, 2016 at 21:22

answered Nov 1, 2016 at 21:16

Daniel Hall

1911 silver badge9 bronze badges

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

Comments

carkod · Accepted Answer · 2016-11-01 21:32:37Z

4

Here is my dummy explanation.

i can never be equal to data.lenght

If for example:

var data = ['Bob', 'John', 'Mike'];
data[0] = Bob
data[1] = John
data[2] = Mike
data[3] = ?

Therefore data[3] cannot be equal to data.length = 3, it starts looping through 0.

Hope it helps for newbies.

answered Nov 1, 2016 at 21:32

carkod

2,2111 gold badge22 silver badges35 bronze badges

Comments

Endless · Accepted Answer · 2016-11-01 21:29:08Z

3

Just to demostrate what goes wrong

basket = ['milk', 'egg', 'chees']

for (var i = 0; i <= basket.length; i++) {
  console.log('loop ' + i, basket[i])
}

/*
Logs: 
loop 0 milk
loop 1 egg
loop 2 chees
loop 3 undefined
*/

answered Nov 1, 2016 at 21:29

Endless

38.7k14 gold badges118 silver badges138 bronze badges

Comments

user5004526 · Accepted Answer · 2016-11-01 21:34:43Z

1

Change

for (var i = 0; i <= data.length; i++)

to

for (var i = 0; i < data.length; i++)

answered Nov 1, 2016 at 21:34

user5004526

Comments

Rahul Sarkar · Accepted Answer · 2021-07-28 22:29:40Z

1

basket = ['milk', 'egg', 'chees']

var x = "";

for (var i = 0; i <= basket.length; i++) {

x = 'loop ' + i, basket[i];
  console.log(x);
}

Hope it solves the problem. 'loop ' + i, basket[i]; -- itself creates an empty unidentified element if is not declared with a variable and variable must have an empty content, like this var x = "";

answered Jul 28, 2021 at 22:29

Rahul Sarkar

111 bronze badge

Collectives™ on Stack Overflow

pushing data into array inside a for loop JavaScript

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related