簡(jiǎn)單理解淺拷貝和深拷貝
博客地址：https://www.zhouhaipeng.com/
github https://github.com/Roc-zhou
什么是淺拷貝椅挣？
簡(jiǎn)單來(lái)說(shuō) 有個(gè) A 和 B，我們把A 復(fù)制給了B秩伞，當(dāng)我們修改B 的時(shí)候 發(fā)現(xiàn) A 的值也會(huì)發(fā)生改變吁伺，這就是淺拷貝
- 舉個(gè)例子
let a = [{ name: '張三' }],
b = a
b[0].name = '李四'
console.log(a); // [{ name: '李四' }]
console.log(a); // [{ name: '李四' }]
-
使用圖解釋一下
9419407-1d09c5b4a0a06252.png
9419407-ff2d0c88f14929a3.png
從圖中我們可以看到 a和b 全部 都指向了 同一個(gè) 堆內(nèi)存的值 饮睬，所以我們改變 b 的數(shù)據(jù) a也會(huì) 改變 。
那什么是深拷貝呢篮奄？
理解了淺拷貝捆愁，我猜 深拷貝就是修改 b 的值 a 還是原來(lái)的值。
- 還是舉個(gè)例子先
// 深拷貝的方法有幾種 這里只寫(xiě)一種 （JSON.stringify窟却、jquery等）
function clone(obj) {
let result = obj.constructor === Array ? [] : {};
if (typeof obj !== 'object') {
return obj;
}
for (const x in obj) {
if (obj.hasOwnProperty(x)) {
if (typeof obj[x] === 'object' && obj[x] !== null) {
result[x] = clone(obj[x]); //遞歸復(fù)制
} else {
result[x] = obj[x];
}
}
}
return result
}
let a = [{ name: '張三' }],
b = clone(a)
console.log(a); // [ { name: '張三' } ]
console.log(b); // [ { name: '張三' } ]
// 成功復(fù)制
// 修改b的值
b[0].name = '李四'
console.log(a); // [ { name: '張三' } ]
console.log(b); // [ { name: '李四' } ]
-
還是上個(gè)圖
9419407-efe13a61709541e3.png
9419407-47e577f9b52cb1c7.png
從圖上我們可以看到 b 復(fù)制 a 是在 堆內(nèi)存中復(fù)制了一個(gè)生成了一個(gè)新的昼丑，所以我們修改b 的值的時(shí)候 a 不會(huì)受影響，這樣我們就得到了一個(gè)新的b 達(dá)到了深拷貝的效果夸赫！
