Вложенные массивы - обновление подмассивов во время вложения с циклом for не работает?

Question

const nestedArr = [];
// ADD CODE HERE
let arr = [];
for(let i=0; i<5; i++){
  arr.push(`loop${i}`, i);
  nestedArr.push(arr);
  // nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr)

Эй, ребята, просто интересно о каком-то поведении JS, которое я не понимаю. Задача решается при использовании закомментированной строки в сером // nestedArr.push([цикл ${I}, i]); но когда я пытаюсь использовать другой подход, не комментируется

arr.push(`loop${i}`, i);
nestedArr.push(arr);

не работает, как я думал.

Подход состоит в том, чтобы сначала объявить массив arr и нажмите на нее каждые 5 итераций строку loop${i} и второй элемент индекса i, Следующий толкающий массив arr в nestedArr в течение 5 итераций. Ожидаемый результат, если arr помещается 5 раз в nestedArr, причем каждый push предположительно добавляет один элемент за раз в пределах arr. Тем не менее, как вы можете видеть, толкаемые подмассивы arr толкаются, удерживая по 5 элементов каждые 5 раз. Я ожидал, что первая итерация будет равна 0, когда массив подмассивов, помещенный в nestedArr, будет содержать только один элемент, но уже содержит 5 таких же элементов с другими подмассивами.

[['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4], ['loop0', 0, 'loop1', 1, 'loop2', 2, 'loop3', 3, 'loop4', 4]]

ожидаемый результат должен быть

[['loop0', 0], ['loop1', 1], ['loop2', 2], ['loop3', 3], ['loop4', 4]]

На каждой итерации добавляется один элемент за раз в пределах массива subarray, который затем передается nestedArr в течение 5 итераций. Есть идеи, почему?

Answer 1

Вы должны инициализировать массив arr каждый раз цикл начинается снова:

const nestedArr = [];
for (let i = 0; i < 5; i++) {
  let arr = [];
  arr.push(`loop${i}`, i);
  nestedArr.push(arr);
}
console.log(nestedArr);

Answer 2

Массив - это объект, поэтому то, что вы помещаете в окончательный массив nestedArr, он фактически содержит ссылку на подмассив (в вашем случае - arr). Теперь, когда вы помещаете данные в один и тот же массив подмассива, ссылка на них обновляется в основном массиве каждый раз, и, наконец, когда вы печатаете вывод, он содержит один и тот же объект несколько раз в массиве. Чтобы избежать этого, вы можете либо использовать то, что предложил @Oihane Vázquez, либо напрямую помещать данные в основной массив следующим образом.

const nestedArr = [];
for (let i = 0; i < 5; i++) {
  nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr);

Answer 3

Вы забыли правильно добавить в arr:

const nestedArr = [];
// ADD CODE HERE
let arr = [];
for(let i=0; i<5; i++){
  arr.push([`loop${i}`, i]);
  nestedArr.push(arr);
  // nestedArr.push([`loop${i}`, i]);
}

console.log(nestedArr)

Смотри, я делаю массив, прежде чем нажать в обр arr.push([цикл ${I}, i]);