JS中的深浅拷贝

这几乎是前端面试的高频问题。

什么是深浅拷贝？

浅拷贝

var a = {name:'steven'}
var b = a 
b.name = "bob"
console.log(a) // {name:'bob'}
console.log(b) // {name:'bob'}

把对象a的值赋值给b，再修改b.name的值， a.name的值跟着一起改变了，这就是浅拷贝。
非专业解释： 因为a 和 b的指针指向同一个内存空间，赋值只是对指针进行了拷贝，故为浅拷贝。

深拷贝

显而易见，深拷贝就是要修改b.name时， a.name的值不变。 说白了就是新开辟一块内存空间存储b。

第一种方法
目标对象只有一层如 {name:'steven'}

var a = {name:'steven'}
var b = JSON.parse(JSON.stringify(a))
// 先将其JSON序列化，再解析，得到深拷贝的a
b.name = 'bob'
console.log(a) // {name:'steven'}
console.log(b) // {name:'bob'}

不太建议使用。
缺点：深拷贝之后，不管这个对象原来的构造函数是什么，在深拷贝之后都会变成Object。同时如果对象中存在循环引用的情况也无法正确处理。 引用:https://blog.csdn.net/yangyixue123/article/details/79687859

第二种方法

var a = {name:'steven'}
var b = Object.assign({},a)
// 使用ES6的Object.assign方法
b.name = 'bob'
console.log(a) // {name:'steven'}
console.log(b) // {name:'bob'}

第三种方法，写一个递归方法

function deepCopy(obj) {
        var result = Array.isArray(obj) ? [] : {};
        for (var key in obj) {
            if (obj.hasOwnProperty(key)) {
                if (typeof obj[key] === 'object') {
                    result[key] = deepCopy(obj[key]);   //递归复制
                } else {
                    result[key] = obj[key];
                }
            }
        }
        return result;
    }