HTML5 - 提供原生的 JavaScript DeepCopy 方法 structuredClone
https://html.spec.whatwg.org/multipage/structured-data.html#structured-cloning
在規範內提供了一個可以 Deep Copy 的功能 - structuredClone()
JavaScript 中 Copy Object 的時候基本上都是淺 Copy,意指當修改副本的值的是後,也會影想到原本的 Object
const origin = {
name: "攻城獅"
wife: {
name: "pekora",
age: 112
}
};
const isCopy = {...origin};
// 修改值會影響原本 Object
isCopy.wife.age = 111;
console.log(origin.wife.age); // 111
JavaScript 對於非原始資料型態的複製方式會不同,例如 Array 和 Object 會複製其 reference。而在 JavaScript 常見的方式就是使用了像是 lodash 的 cloneDeep() 等第三方 Library 來做處理。或是直接用 JSON 的方式作轉換
const isCopy = JSON.parse(JSON.stringify(origin));
但是之後將會提供更原生的方式來去做到這件事情,就是使用 structuredClone()
const isCopy = structuredClone(origin);