JavaScript详解克隆

克隆

浅层克隆

var obj = {
  name: "lorn",
  age: 34,
  height: 178,
  card:['Moica','beijing']   //引用值
};

var obj1 = {};
function clone(origin, target) {
  var target = target || {};
  for (var key in origin) {
    target[key] = origin[key];
  }
}
clone(obj, obj1);

浅层克隆拷贝的只有原始值，并且不随之变化;
如果拷贝引用值，那么指向的地址是一样，随其中之一会跟着改变

深层克隆（深拷贝）

区别于浅层克隆，是相互独立的

存在一个分析过程，（这里只区分数组与对象）

1. 判断是不是原始值
2. 判断是数组还是对象
3. 建立相应的数组或对象

var obj = {
  name: "lorn",
  age: 34,
  height: 178,
  card: ["Moica", "beijing"], //引用值
  wife: {
    name: "aaa",
    son: {
      name: "bbb",
    },
  },
};
var obj1 = {};
//用for-in遍历
//首先要判断是原始值还是引用值，（typeof）Object
//如果是引用值，判断是数组还是对象
（三种方法区分数组和对象instanceof，constructor，toString）
//递归

function deepClone(origin, target) {
  var target = target || {}; //或运算符的运用
  toStr = Object.prototype.toString;
  arrStr = "[object Array]";
  for (var key in origin) {
    if (origin.hasOwnProperty(key)) {
      if (origin[key] !== "null" && typeof origin[key] === "object") {
        if (toStr.call(origin[key]) == arrStr) {
          target[key] = [];
        } else {
          target[key] = {};
        }
        //递归
        deepClone(origin[key], target[key]);
      } else {
        target[key] = origin[key];
      }
    }
  }
  return target; //如果没有输入target
}

deepClone(obj, obj1);
console.log(obj1);