JS深度克隆的原理

  在开发过程中如果需要深度克隆，可能很多开发人员都会选择已有的库，采取调用API的形式，可以更加快速的实现效果。比如lodash库。但还是要自己代码实现下这个深度克隆，以便掌握其原理。此外，其原理也是比较简单的，代码原理如下：

代码示例

// 以下代码形式在vue中使用，但其中原理都是一样的
 mounted() {
    let o1 = {a:1, b:[1,2,3], c: '张三'};
    let o2 = this.deepClone(o1);
    console.warn('克隆后的对象比较', o1 === o2); // false
}
methods: {
    // 深度克隆
    deepClone(value) {
      // 判断是否为数组，这个判断必须写在判断对象前面，因为数组也是一种对象
      if (Array.isArray(value)) {
        let cloneValue = [];
        for (let i = 0; i < value.length; i++) {
          cloneValue.push(this.deepClone(value[i]));
        }
        return cloneValue;
      }
      // 判断是否为对象
      if (typeof value === 'object' && value !== null) {
        let cloneValue = {};
        for (const key in value) {
          cloneValue[key] = this.deepClone(value[key]);
        }
        return cloneValue;
      }
      return value;
    }
  }