对于深浅拷贝的理解

首先需要说到js的数据类型和堆栈的问题：

　　原始数据类型：string，boolean，number，null，undefined，因为占据空间小，大小固定，使用频繁，所以存储在栈中。

　　引用数据类型：object，array，function，空间大，大小不固定，存储在堆中，引用数据类型在栈中存储了指针，该指针指向堆中的该实体，当寻找引用值时，先检索其在栈中的地址，取得地址后，再在堆中获取实体。

 

 浅拷贝 和 深拷贝 是相对引用数据类型而言的。

深拷贝和浅拷贝的示意图大致如下：

 

 

 赋值和深浅拷贝对原数据的影响：

 

 

 

 

 浅拷贝的定义：

　　浅拷贝指的是仅拷贝对象的地址，这样被拷贝的对象会因为拷贝的对象的数据改变而改变。

　　实现浅拷贝的方法：

　　　　

//1.利用es6 Obect.assign()实现浅拷贝

var obj = { a: {a: "kobe", b: 39} };
var initalObj = Object.assign({}, obj);
initalObj.a.a = "wade";
console.log(obj.a.a); // wade

注意：当object只有一层的时候，是深拷贝

let obj = {
   username: 'kobe'
};
let obj2 = Object.assign({},obj);
obj2.username = 'wade';
console.log(obj);//{username: "kobe"}

//2.直接引用赋值 var arr1 = ["a","b",1,2,3];var arr2 = arr1 

//3.$.extend( [deep ], target, object1 [, objectN ] )jquery实现浅拷贝

//4.Array.prototype.concat()与Array.prototype.slice()

 

深拷贝的定义：

　　指拷贝时新建一个堆地址，两者并不关联，不会互相影响。

　　实现深拷贝的方法：

　　

//1.循环
<script>
    let a = [1,2,3];
    let b = [];
    for(let j = 0; j < a.length; j++){
        b.push(a[j]);
    } 
    console.log('添加元素前的 a=' + a);
    console.log('添加元素前的 b=' + b);
    b.push(4)
    console.log('添加元素后的 a=' + a);
    console.log('添加元素后的 b=' + b);
</script>


//2.JSON对象的parse和stringify都是深拷贝

<script>
    let obj = {name:'cancan',age:23,company : { name : '阿里', address : '杭州'} };
    let obj_json = JSON.parse(JSON.stringify(obj));
    console.log(obj === obj_json);
    obj.company.name = "cancan82";
    obj.name = "haha";
    console.log(obj);
    console.log(obj_json);
</script>

 

大概的理解：

　　简单说就是A有值，B为空，赋值b=A，修改A时如果B随之改变，则为浅拷贝，不变为深拷贝。

 

 

资料：https://blog.csdn.net/weixin_48594833/article/details/120270651，https://www.cnblogs.com/leng12/p/leng.html，https://www.cnblogs.com/baozhe/p/13227849.html，彻底讲明白浅拷贝与深拷贝 - 简书 (jianshu.com)