js浅克隆和深克隆

基本定义

浅复制(浅克隆)：直接将存储在栈中的值赋值给对应变量，如果是基本数据类型，则直接赋值对应的值，如果是引用类型，则赋值的是地址

深复制(深克隆)：就是把数据赋值给对应的变量，从而产生一个与源数据不相干的新数据(数据地址已变化)。深拷贝，是拷贝对象各个层级的属性。

基本数据类型的赋值（String）

let a = "hello world";
let b = a;
alert( b ); // 'hello world'
a = "changed";
alert( b ); // 'hello world'
// 在这段代码中，把a赋值给b，当a的值发生变化时，并不影响b

引用数据类型的赋值（Array）

let arr1 = [1, 2, 3, 4];
let arr2 = arr1;
console.log( arr2 );  // [10, 2, 3, 4]
arr1[0] = 10;
console.log( arr2 );  // [10, 2, 3, 4]

// 在这段代码中，把arr1赋值给arr2，当arr1的值改变时，arr2对应的值也会改变

注意：

1. 对于基本数据类型而言，把a的值赋值给b后，a的修改，不会影响到b。
2. 对于引用数据类型而言，把arr1赋值给arr2后，arr1的修改，会影响到arr2对应的值
3. 基本数据类型是直接存储在栈内存中的，而引用数据类型，则仅仅是把地址存储在栈内存中,真正的数据是存储在堆内存中的，赋值操作时，仅仅把地址进行了赋值。

浅克隆

let obj = {
   name: "xie",
   age: "20",
   gender: "female",
   wife: {
    name: "abc",
    son: {
     name: "hello",
    },
   },
};
let obj1 = {};
function clone(origin, target) {
  for (var prop in origin) {
    if (origin.hasOwnProperty(prop)) {
      target[prop] = origin[prop];
    }
   }
}
clone(obj, obj1);
obj1.name = "wold";
console.log(obj1.name);
console.log(obj.name);
obj1.card.push("javascript");
console.log(obj.card);

深克隆

function deepClone(origin, target) {
  var target = target || {};
  var toStr = Object.prototype.toString;
  var arrStr = "[object Array]";
  for (var prop in origin) {
    if (origin.hasOwnProperty(prop)) {
      if (origin[prop] !== null && typeof origin[prop] == "object") {
        target[prop] = toStr.call(origin[prop]) == arrStr ? [] : {};
        deepClone(origin[prop], target[prop]);
      }
    }
  }
 return target;
}
deepClone(obj, obj1);
obj1.card.push("word");
console.log(obj.card);