美文网首页
📎js深度拷贝

📎js深度拷贝

作者: 索隆萨克 | 来源:发表于2019-05-06 16:28 被阅读0次

方法1 定义方法clone

function clone(obj) {
  let copy;
  if (obj instanceof Array) {
    copy = [];
    let i = obj.length;
    while (i--) {
      copy[i] = clone(obj[i]);
    }
    return copy;
  } else if (obj instanceof Object) {
    copy = {};
    for (let k in obj) {
      copy[k] = clone(obj[k]);
    }
    return copy;
  } else {
    return obj;
  }
}

方法1缺点:无法拷贝函数

方法2 使用 JSON.stringify 和 JSON.parse 方法

var arr = ['old', 1, true, ['old1', 'old2'], {old: 1}]
var new_arr = JSON.parse( JSON.stringify(arr));
console.log(new_arr);   //  [ 'old', 1, true, [ 'old1', 'old2' ], { old: 1 } ]

方法2缺点:同样无法拷贝函数

方法3 定义deepClone函数

function deepClone(source) {
  // 递归终止条件
  if (!source || typeof source !== 'object') {
    return source;
  }
  var targetObj = source instanceof Array ? [] : {};
  for (var key in source) {
    // 该方法会忽略掉那些从原型链上继承到的属性。
    if (source.hasOwnProperty(key)){
    // 避免死循环对象属性
      if(source[key] === source){
        console.warn(new Error('circular object'))
      }else if (source[key] && typeof source[key] === 'object') {  //数组 typeof的结果也是object
        targetObj[key] = deepClone(source[key]);
      } else {
        targetObj[key] = source[key];
      }
    }
  }
  return targetObj;
}
var object1 = {'year':12, arr: [1, 2, 3], obj: {key: 'value' }, func: function(){return 1;}};
var object2 = [1,[2,[3,4,[5,6]]]]
var newObj= deepClone(object1);
var newObj2 = deepClone(object2)
console.log(newObj)  // { year: 12,arr: [ 1, 2, 3 ],obj: { key: 'value' }, func: [Function: func] }
console.log(newObj2) // [ 1, [ 2, [ 3, 4, [Array] ] ] ]

相关文章

  • js 深度拷贝

    深拷贝(deepClone) 对于一个引用类型,如果直接将它赋值给另一个变量,由于这两个引用指向同一个地址,这时改...

  • 📎js深度拷贝

    方法1 定义方法clone 方法1缺点:无法拷贝函数 方法2 使用 JSON.stringify 和 JSON.p...

  • 面试总结之基础篇(1)

    深拷贝与浅拷贝 原型与原型链 防抖节流 this 指向 new关键字 深度剖析js闭包

  • vue3 ts版本深度拷贝功能推荐ts-deepmerge

    在使用js版本开发vue的时候,需要用到深度拷贝。一般都是用的deepMerge这个进行深度拷贝。但是在VUE3里...

  • js深拷贝广度优先及深度优先处理Symbol

    js对象深拷贝,文章使用了广度优先和深度优先,同时也出来了symbol类型的拷贝。 文章转载优化来源:

  • js 浅拷贝和深拷贝

    js实现深拷贝(深度克隆)[https://www.cnblogs.com/cirry/p/13395291.ht...

  • js对象深度拷贝

    js对象为什么要深度拷贝,不深度拷贝有什么影响? 举个例子 将对象通过 “ = ”复制给另一个对象时,只是相对于给...

  • js基础篇-简单的对象拷贝方法

    js对象拷贝的方法  对象拷贝的方法是一个难点,尤其是深拷贝。 1. 适合情况: JSON对象的深度克隆。方法是先...

  • 手写实现深度拷贝

    手写实现深度拷贝 本文参考:面试题之如何实现一个深拷贝 基础理论 拷贝的基础是赋值,在 js 中,将一个变量赋值给...

  • 关于js的深度拷贝

    内存中的存放形式 简单数据类型:Number、String、undefined、boolean复杂数据类型:Obj...

网友评论

      本文标题:📎js深度拷贝

      本文链接:https://www.haomeiwen.com/subject/nildoqtx.html