js之深拷贝

发表于 | 分类于 | |

JS中对象存储在堆中，对象赋值给变量的过程中实际是把对象在堆中的地址赋值给变量。所以在将一个对象赋值给多个变量时实际是地址赋值给多个变量，实际是一个对象。在改变对象内值得同时如不进行深拷贝也会影响到其他变量。

深拷贝实现

JSON.sringify 和 JSON.parse

1
2
//  将对象转换为字符串，在通过parse进行解析重新建立对象
JSON.parse(JSON.stringfy(obj))

弊端：

  • 不能复制function、正则、Symbol、Error对象
  • 循环引用报错
  • 相同的引用会被重复复制
  • 如果是时间对象将会得到字符串，而不再是一个时间对象

递归实现深拷贝

1
2
3
4
5
6
7
8
9
10
11
12
13
function deepcopy(obj) {
    if(typeof obj !== 'object') return obj
    var deepobj = obj instanceof Array ? []:{}
    for(let key in obj){
        // 判断是否为自身属性而非继承属性
        if (obj.hasOwnProperty(key)) {
            typeof obj[key] === "object" ? deepobj[key] = deepcopy(obj[key]): deepobj[key] = obj[key]
        }

    }
    console.log(deepobj)
    return deepobj
}