深拷貝與淺拷貝的理解
簡(jiǎn)單來(lái)說(shuō)区宇，深拷貝主要是將另一個(gè)對(duì)象的屬性值拷貝過(guò)來(lái)之后，另一個(gè)對(duì)象的屬性值并不受到影響，因?yàn)榇藭r(shí)它自己在堆中開(kāi)辟了自己的內(nèi)存區(qū)域对竣，不受外界干擾。
淺拷貝主要拷貝的是對(duì)象的引用值榜配，當(dāng)改變對(duì)象的值否纬，另一個(gè)對(duì)象的值也會(huì)發(fā)生變化。
深拷貝的代碼實(shí)現(xiàn)
方法一：for循環(huán)拷貝直接賦值法
代碼實(shí)現(xiàn)如下
<script>
function deepCopy(obj1) {
var obj2 = Array.isArray(obj1) ? [] : {};
for (let i in obj1) {
obj2[i] = obj1[i];
}
return obj2;
}
var obj1 = {
a: 1,
b: 2,
c: {
d: 3
}
}
var obj2 = deepCopy(obj1);
obj2.a = 3;
obj2.c.d = 4;
alert(obj1.a); // 1
alert(obj2.a); // 3
alert(obj1.c.d); // 4
alert(obj2.c.d); // 4
</script>
方法二：Object.assign
代碼實(shí)現(xiàn)如下
<script>
const info = {
name: "kobe",
age: 18,
friend: {name: "james"}
};
const obj = Object.assign({}, info);
const obj.friend.name = "lili"
console.log(obj.name);// kobe
console.log(obj.friend.name);// lili 這里是淺拷貝
</script>
方法三：es6的擴(kuò)展運(yùn)算符"..."
代碼實(shí)現(xiàn)如下
<script>
var a=[1,2,[3,4]]
var b=[...a];
b[0]=5;
b[2][0]=6
console.log(b[0]);//5
console.log(a[0])//1
console.log(b[2][0]);//6
console.log(a[2][0])//6
</script>
方法四：JSON.parse和JSON.stringify
代碼實(shí)現(xiàn)如下：
<script>
const info = {name: "kobe", age: 18, friend: {name: "kobe"}};
const obj = JSON.parse(JSON.stringify(info));
info.friend.name = "james";
console.log(obj.friend.name);//james 這里是淺拷貝
console.log(obj.name);//kobe
</script>
