javascript - Does forEach() bind by reference?

Question

var arr = ['Foo'];

arr.forEach(function(item){
  console.log(item);
  item = 'Lorem';
  console.dir(arr[0]);

});

for (var item in arr){
  arr[item] = 'Ipsum';
  console.dir(arr[0]);
}

Like the code above shows, I noticed that changing the value of an item passed to the callback of forEach() does not cause the iterated object to alter.

Using for...in certainly does.

Why is that & how should I alter values in an array?

I find that the topic is covered quite confusing on MDN

Answer 1

Using for...in certainly does.

No it doesn't. Your forEach loop is equivalent to this for...in loop (apart from the order):

for (var index in arr) {
  var item = arr[index];
  console.log(item);
  item = 'Lorem';
  console.dir(arr[0]);
}

Do you see that the array isn't modified either? That's because JavaScript is always pass-by-value, and there is a very simple rule to keep in mind:

Assigning a value to a variable never changes the value of another variable or data structure.

That means, assigning a new value to item, cannot change an element of arr. If you want to to modify the array, you have to mutate it directly by assigning a value to an index, i.e.

arr[index] = 'foo';