浅拷贝与深拷贝的定义和区别

一、数据类型

数据分为基本数据类型(String, Number, Boolean, Null, Undefined，Symbol)和对象数据类型。

1、基本数据类型的特点：数据直接存储在栈中。

2、引用数据类型的特点：存储的是该对象在栈中引用，真实的数据存放在堆内存里

引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。当解释器寻找引用值时，会首先检索其在栈中的地址，取得地址后从堆中获得实体。

二、浅拷贝与深拷贝

深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。

浅拷贝图解

当Obj2=Obj1进行拷贝时，其实复制的是Obj1的引用地址，而并非堆里面的值。

而当我们Obj1[0]=9时进行数组修改时，由于Obj1与Obj2指向的是同一个地址，所以自然b也受了影响，这就是所谓的浅拷贝了。

深拷贝图解

在堆内存中也开辟一个新的内存专门为Obj2存放值，就像基本类型那样。

而当我们Obj1[0]=9时进行数组修改时，由于Obj1与Obj2指向的是不同的地址，所以Obj2不受影响，这就是深拷贝。

定义

浅拷贝：完成拷贝后可能存在彼此之间操作互相影响的就是浅拷贝。

深拷贝：完成拷贝后彼此之间操作绝不会有互相影响的就是深拷贝。

三、浅拷贝和深拷贝的区别

1、浅拷贝只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存。

2、深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。

3、浅拷贝是拷贝一层，深层次的对象级别的就拷贝引用；深拷贝是拷贝多层，每一级别的数据都会拷贝出来。

四、浅拷贝的实现方式

1、Array.prototype.slice()和Array.prototype.concat()-----浅拷贝

Array的slice和concat方法不修改原数组，只会返回一个浅复制了原数组中的元素的一个新数组。

//Array.prototype.concat()方法
var arr = [
    1,
    2, 
    3, 
    {
    name:'join'
 }];
 var arr1=arr.concat();    
 arr1[3].name = 'lisa';
 console.log(arr);
 console.log(arr1)

//Array.prototype.slice()方法
var arr = [
    1,
    2, 
    3, 
    {
    name:'join'
 }];
 var arr1=arr.slice();    
 arr1[3].name = 'lisa';
 console.log(arr);
 console.log(arr1)

Array.prototype.slice()和Array.prototype.concat()进行拷贝时，原数组的元素会按照下述规则拷贝：

1、如果该元素是个对象引用(不是实际的对象)，concat和slice 会拷贝这个对象引用到新的数组里。两个对象引用都引用了同一个对象。如果被引用的对象发生改变，则新的和原来的数组中的这个元素也会发生改变。

2、对于字符串、数字及布尔值来说（不是 String、Number 或者 Boolean 对象），concat和slice 会拷贝这些值到新的数组里。在别的数组里修改这些字符串或数字或是布尔值，将不会影响另一个数组。

var arr = [
    1,
    2, 
    3, 
    {
    name:'join'
 }];
 var arr1=arr.concat();   
 arr1[1] = 5; 
 arr[1]  = 9;
 arr1[3].name = 'lisa';
 console.log(arr);
 console.log(arr1)

2、Object.assign()----浅拷贝

Object.assign()方法可以把任意多个的源对象自身的可枚举属性拷贝给目标对象，然后返回目标对象。

Object.assign()进行的是浅拷贝，拷贝的是对象的属性的引用，而不是对象本身。

当只有一层时，我们可以理解Object.assign()为深拷贝。

3、JSON.parse(JSON.stringify())----深拷贝

let arr = [1,2,3, {
    name: 'join',
},
    function (){
        console.log('hello');
    }
 ];
 let arr1 = JSON.parse(JSON.stringify(arr));
 arr1[3].name = 'lisa';
 console.log(arr,arr1);

用JSON.stringify将对象转成JSON字符串，再用JSON.parse()把字符串解析成对象，一去一来，新的对象产生了，而且对象会开辟新的栈，实现深拷贝。但是JSON.stringify无法作用于函数，所以这种方法无法拷贝函数。