JavaScript 中深拷贝浅拷贝问题

时间:2021-05-19 19:46:21
## JavaScript 中深拷贝浅拷贝问题

首先是堆(heap)和栈(stack)的区分:
js中基本数据类型,undefined、null、Boolean、Number 和 String直接存放在栈中;
引用类型,对象存放在堆中,栈内存中存放的是该对象的引用;
打开浏览器,F12在 console中输入或者命令行进入node输入(> :输入行,<:输出行)
```
> obj = {'1':'a','2':'b','3':'c'}
< Object {1: "a", 2: "b", 3: "c"}
> obj2 = obj
< Object {1: "a", 2: "b", 3: "c"}
> obj[2]='tttt'
< "tttt"
> obj2
< Object {1: "a", 2: "tttt", 3: "c"}
> obj
< Object {1: "a", 2: "tttt", 3: "c"}
```
因为obj和obj2 的引用指向的堆中同一块内存,所以改变了一个,另一个页随之改变,称之为浅拷贝;如果要实现深拷贝,必须遍历obj中所有的属性,赋值给新的对象;如果是多层嵌套,需要递归;实现的代码如下:
```
let deepCopy = function(src){
    let ret = {};
    for (let k in src){
        ret[k]=typeof(k)=='object'?deepCopy(src[k]):src[k];
    }
    return ret;
}
```
## 
```
> obj3 = deepCopy(obj);
< Object {1: "a", 2: "tttt", 3: "c"}
> obj1 === obj3
< false
```
如果是要深拷贝数组,可以new个新的数组,遍历赋值,或者直接使用slice()方法或者contant()方法,要说清楚一个问题不容易,关于这两个方法的具体内容,可以查文档;

## 
关于Object.assgin(),ES6的新方法,可以实现对象的第一层的深拷贝,深层次的对象没有进行深拷贝,在此就不再详述,一时半会也说不清楚,具体可以自行搜索;该深拷贝数组还是没问题的; ```var new_arr = Object.assigin([],old_arr)```