面试题之JavaScript 请写一个深度克隆的函数

小编才疏学浅,若文章、答案有错误之处,欢迎邮件通知小编及时修改,同时也可以面试题投稿。最后祝大家共同进步!

常用的拷贝技术:

  • arr.concat() //数组浅拷贝
  • arr.slice() //数组浅拷贝
  • JSON.parse(JSON.stringify(arr/obj)) //数组对象浅拷贝但不能处理函数数据
  • 浅拷贝包含函数数据的对象/数组
  • 深拷贝包含函数数据的对象/数组

拷贝数据:

  • 基本数据类型:
    • 拷贝后生成一份新的数据,修改拷贝以后的数据不会影响原来的数据
  • 对象/数组
    • 拷贝后不会生成新的数据,直接引用原数据,修改拷贝后的数据会影响原数据

拷贝数据的方法:

  • 直接赋值给一个变量 //浅拷贝
  • Object.assign() //浅拷贝
  • arr.concat() //数组浅拷贝
  • arr.slice() //数组浅拷贝
  • JSON.parse(JSON.stringify(arr/obj)) //深拷贝数组对象但不能处理函数数据

浅拷贝(对象/数组):
特点:拷贝的引用,修改拷贝以后的数据会影响原数据

深拷贝(深度克隆):
特点:拷贝的时候生成新数据,修改拷贝以后的数据不会印象原数据

文章标题答案

    function deepClone(obj) {
      var _toString = Object.prototype.toString;

      // null, undefined, non-object, function
      if (!obj || typeof obj !== 'object') {
        return obj;
      }

      // DOM Node
      if (obj.nodeType && 'cloneNode' in obj) {
        return obj.cloneNode(true);
      }

      // Date
      if (_toString.call(obj) === '[object Date]') {
        return new Date(obj.getTime());
      }

      // RegExp
      if (_toString.call(obj) === '[object RegExp]') {
        var flags = [];
        if (obj.global) { flags.push('g'); }
        if (obj.multiline) { flags.push('m'); }
        if (obj.ignoreCase) { flags.push('i'); }

        return new RegExp(obj.source, flags.join(''));
      }

      var result = Array.isArray(obj) ? [] :
        obj.constructor ? new obj.constructor() : {};

      for (var key in obj) {
        result[key] = deepClone(obj[key]);
      }

      return result;
    }

    function A() {
      this.a = a;
    }

    var a = {
      name: 'qiu',
      birth: new Date(),
      pattern: /qiu/gim,
      container: document.body,
      hobbys: ['book', new Date(), /aaa/gim, 111]
    };

    var c = new A();
    var b = deepClone(c);
    console.log(c.a === b.a);
    console.log(c, b);

原文:
编写 javascript 深度克隆函数 deepClone

原文地址:https://www.cnblogs.com/jiaoshou/p/13720225.html