深拷贝的几种简单实现方式

深拷贝开辟一个新的栈，两个对象属完成相同，但是对应两个不同的地址，修改一个对象的属性，不会改变另一个对象的属性

常见的深拷贝方式有：

• _.cloneDeep()
• jQuery.extend()
• JSON.stringify()
• 手写循环递归

_.cloneDeep() lodash 插件库

const _ = require('lodash');
const obj1 = {
  a: 1,
  b: { f: { g: 1 } },
  c: [1, 2, 3]
};
const obj2 = _.cloneDeep(obj1);
console.log(obj1.b.f === obj2.b.f);// false

jQuery.extend() jq内置方法

const $ = require('jquery');
const obj1 = {
  a: 1,
  b: { f: { g: 1 } },
  c: [1, 2, 3]
};
const obj2 = $.extend(true, {}, obj1);
console.log(obj1.b.f === obj2.b.f); // false

JSON.stringify()

const obj2=JSON.parse(JSON.stringify(obj1));

但是这种方式存在弊端，会忽略 undefined 、 symbol 和 函数 例如:

const obj = {
  name: 'A',
  name1: undefined,
  name3: function() {},
  name4:  Symbol('A')
}
const obj2 = JSON.parse(JSON.stringify(obj));
console.log(obj2); // {name: "A"}

循环递归

function deepClone(obj, hash = new WeakMap()) {
 if (obj === null) return obj; // 如果是null或者undefined我就不进行拷贝操作
 if (obj instanceof Date) return new Date(obj);
 if (obj instanceof RegExp) return new RegExp(obj);
 // 可能是对象或者普通的值 如果是函数的话是不需要深拷贝
 if (typeof obj !== "object") return obj;
 // 是对象的话就要进行深拷贝
 if (hash.get(obj)) return hash.get(obj);
 let cloneObj = new obj.constructor();
 // 找到的是所属类原型上的constructor,而原型上的 constructor指向的是当前类本身
 hash.set(obj, cloneObj);
 for (let key in obj) {
  if (obj.hasOwnProperty(key)) {
   // 实现一个递归拷贝
   cloneObj[key] = deepClone(obj[key], hash);
 }
}
 return cloneObj;
}

小结

前提为拷贝类型为引用类型的情况下：

• 浅拷贝是拷贝一层，属性为对象时，浅拷贝是复制，两个对象指向同一个地址
• 深拷贝是递归拷贝深层次，属性为对象时，深拷贝是新开栈，两个对象指向不同的地址