Javascriptの連想配列をpushするときに詰まった話

ポイント

1. Array.push(original)は参照になる。
2. Array.push(Object.assign({}, original))を使おう。

はじめに

次のようなプログラムを作成したときに、正しいnoが得られないトラブルが発生した。

result = [{a: 'a'}, {a: 'b'}, ...];
  for (let i = 0; i < result.length; i++) {
  a.push(result);
  if (適当な条件) {
    b.push(result);
  } else {
    c.push(result);
  }
}

// Aに対する処理
for (let i = 0; i < a.length; i++) {
  // ...
  a[i].no = i;
}

// Bに対する処理
for (let i = 0; i < b.length; i++) {
  // ...
  b[i].no = i;
}

// Cに対する処理
for (let i = 0; i < c.length; i++) {
  // ...
  c[i].no = i;
}

原因

Array.pushは参照になるために、すべてのArrayが同じ連想配列に書き込んだために正しい数値が得られなかった。

対策

誤

Array.push(result);

正

Array.push(Object.assign({}, result));

PUSH対象の連想配列をObject.assignを使用してコピーしてからpushすることで、元のデータを参照することを避けられる。