Невозможно назначить правильные значения массива в forEach

Question

Я недавно столкнулся со странным (для меня) поведением.

 let test = [
    { id: 1, name: 'test1' },
    { id: 2, name: 'test2' },
    { id: 3, name: 'test3' }
]
let test2 = []
test.forEach((elem, index) => {

    console.warn(elem, index);
    test2.push(elem.name)
    elem.arr = test2
})

console.warn(test);

, и я хочу, чтобы ожидаемый результат был таким

[ { id: 1, name: 'test1', arr: [ 'test1'] },
  { id: 2, name: 'test2', arr: [ 'test1', 'test2'] },
  { id: 3, name: 'test3', arr: [ 'test1', 'test2', 'test3' ] }]

, но я получил это

[ { id: 1, name: 'test1', arr: [ 'test1', 'test2', 'test3'] },
  { id: 2, name: 'test2', arr: [ 'test1', 'test2', 'test3'] },
  { id: 3, name: 'test3', arr: [ 'test1', 'test2', 'test3'] }]

Может кто-нибудь объяснить мне, почему это происходит (возможно, что-то о ссылках?) И решение?

Answer 1

Существует только один массив test2, который упоминается (через свойство arr) три раза подряд. Все эти записи указывают на массив single .

Вы, вероятно, хотели взять копию:

elem.arr = [...test2]

let test = [
    { id: 1, name: 'test1' },
    { id: 2, name: 'test2' },
    { id: 3, name: 'test3' }
]
let test2 = []
test.forEach((elem, index) => {

    //console.log(elem, index);
    test2.push(elem.name)
    elem.arr = [...test2]
})

console.log(JSON.stringify(test, null, 2));

Answer 2

возможно что-то про ссылки?

Вы правы.Присвоение не делает копию значения test2 в elem.arr Так что после выполнения операции.Если вы попытаетесь запустить test2 = [] Все свойство arr будет иметь значение []

Если вы захотите это сделать, вы можете выполнить деструктуру так же, как ответ спонсора

Answer 3

Я считаю, что происходит то, что атрибут arr для каждого элемента устанавливается равным ссылке test2, а не копируется в содержимое test2 в то время.

Дополнительная информацияздесь: Является ли JavaScript языком передачи по ссылке или передачей по значению?

См. также: Копировать массив по значению

На основепо второй ссылке вам нужно создать новые массивы при назначении на elem.arr.

elem.arr = test2.slice();

[Обновить] @spender имел более новый способ копирования массивов, о которых я не знал (все еще догонялES6).Смотри также: https://www.samanthaming.com/tidbits/35-es6-way-to-clone-an-array