シャローコピーとディープコピー違い

シャローコピーとディープコピー違い

シャローコピー

コピー元のオブジェクトとコピー先のオブジェクトがメモリ上の同じデータ(インスタンス変数)を参照

ディープコピー

オブジェクトのみのコピーではなく、オブジェクトとメモリ上のデータ(インスタンス変数)の両方をコピーする

シャローコピーの挙動

シャローコピーの挙動を少し試す

// シャローコピー
nameList = [{"name": "name"}];
copyNameList = nameList.slice(0); // シャローコピー

nameList[0]["name"] = "change_name"; // オブジェクトの更新
console.log(nameList);
console.log(copyNameList); // 元々の配列は更新したら、copyNameListも更新される

ディープコピーの挙動

ディープコピーの挙動を少し試す

// ディープコピー
let nameList2 = [{"name": "name"}]
let copyNameList2 = nameList2.map( list => ({...list})) // ディープコピー
nameList2[0].name = "change_name" // オブジェクトの更新
console.log(nameList2)
console.log(copyNameList2) // 元々の配列は変更しても、copyした配列は変更されない

参考

https://qiita.com/yamayamasan/items/8f4fdc47f538c7027373
https://teratail.com/questions/294137
https://itsakura.com/it-program-shallow
https://kurochan-note.hatenablog.jp/entry/20110316/1300267023
https://qiita.com/k_2929/items/0ae5085d61fa5598c76e