关于javascript:js中的赋值-浅拷贝和深拷贝

前言

js 数据类型次要分根本数据类型和援用数据类型。前者包含 Number,String 等，后者次要是 Object, 因而以下会针对不同的数据类型来剖析，同时须要一点 js 的内存的常识，以下先简要提一下

js 内存

js 内存，或者说大部分语言的内存都分为栈和堆。根本数据类型的变量值调配在栈上，援用数据类型的变量值调配在堆上，栈中只是存储具体堆中对象的地址。

赋值

对于根本数据类型，赋值操作是拷贝，即新旧变量不会相互影响。

var a = 1;
var b = a;
b = 2;
console.log(b); // 2

对于援用数据类型，赋值操作只是在栈中新增一个指向堆中对象的变量，即复制援用地址。新旧变量之间会相互影响，即在新变量上扭转对象值，旧变量对应值也会扭转。

var a = {name: "mike"};
var b = a;
b.name = "jack";
console.log(a); // {name: "jack"}

浅拷贝

对于根本数据类型和不具备嵌套对象的数据，均是拷贝操作，新旧变量之间不会相互影响。

var a = {name: "mike"};
var b = {};
b.name = a.name;
b.name = "jack";
console.log(a) // {name: "mike"}

然而对于具备嵌套对象的数据，浅拷贝只拷贝第一层对象，深层次的值依然是复制援用地址。

var a = {
    name: "mike",
    language: {
        first: "english",
        second: "chinese"
    }
};
var b = {};
b.name = a.name;
b.name = "jack";
b.language = a.language;
b.language.first = "japanese"
console.log(a) // {language : {first: "japanese", second: "chinese"}}

js 实现浅拷贝，思维：遍历 target 的每个属性，将起属性名和值赋值给新变量。
如果你明确了赋值的含意，那么在代码的第四行，当此时的 target[key] 的值是对象的时候，通过赋值赋予新变量，实质上是复制援用数据类型在堆中的地址，就不难理解为什么浅拷贝对于是否是嵌套对象的有不同后果了。

function shallowCopy(target) {let result = {};
    for (const key in target) {result[key] = target[key];
    }
    return result;
}

深拷贝

深拷贝是完完全全的拷贝，新旧变量之间不会相互影响。
对于参数是否是对象有不同的解决办法，如果是对象，对于对象的每个属性和值赋值而后递归解决; 否则间接返回。

function clone(target) {if (typeof target === "object") {
        // 判断是否是数组
        let result = Array.isArray(target)? [] : {};
        for (const key in target) {result[key] = clone(target[key]);
        }
        return  result;
    } else {return target;}
}

参考

深拷贝实现