浅拷贝与深拷贝

160 阅读1分钟

常用的拷贝方法:

其中Array.prototype.concat()和Array.prototype.slice()修改新对象会改到原对象,也就是浅拷贝

基础的深拷贝

function clone(source) {
    var target = {};
    for(var i in source) {
        if (source.hasOwnProperty(i)) {
            if (typeof source[i] === 'object') {
                target[i] = clone(source[i]); // 注意这里
            } else {
                target[i] = source[i];
            }
        }
    }

    return target;
}

基本方法就是递归+判断类型,但是还是有很多问题

一行代码实现深拷贝

JSON.parse(JSON.stringify())实现深拷贝,原理是 用JSON.stringify将对象转成JSON字符串,再用JSON.parse()把字符串解析成对象,一去一来,新的对象产生了,而且对象会开辟新的栈,实现深拷贝。

该方法使用的是递归的方式,同时JSON.stringify内部做了循环引用的检测,所以不会因为死循环导致栈溢出:

let a = {};
a.a = a;

cloneJSON(a) // Uncaught TypeError: Converting circular structure to JSON

这种方法虽然可以实现数组或对象深拷贝,但不能处理函数。这是因为JSON.stringify() 方法是将一个JavaScript值(对象或者数组)转换为一个 JSON字符串,不能接受函数

let arr = [1, 3, {
    username: ' kobe'
},function(){}];
let arr4 = JSON.parse(JSON.stringify(arr));
arr4[2].username = 'duncan'; 
console.log(arr, arr4)

arr4的函数为null