美文网首页
JS如何实现深度拷贝(克隆)

JS如何实现深度拷贝(克隆)

作者: 鲁女女 | 来源:发表于2020-01-06 21:43 被阅读0次

深拷贝(深度克隆)的特点:
拷贝的时候生成新数据,修改拷贝以后的数据不会影响原数据。
拷贝的数据里如果有对象或者数组,那么要继续遍历进行拷贝,除非该数据是数值类型,否则一直遍历进行拷贝。
先判断数据类型---获取最终当前的数据的类型到底是什么类型,才能够进行是否要遍历

// Array Object 
let test=[];
console.log(Object.prototype.toString.call(test))  //[object Array]
let obj = {};
console.log(Object.prototype.toString.call(obj))  //[object Object]

// 根据得到的类型,判断是不是Object,判断是不是Array,如果都不是,直接复制即可
// 得到的是数据的类型
function targetType(target) {
    return Object.prototype.toString.call(target).slice(8, -1)
}
// 如果数据是Object或者是Array 都要遍历,找到里面的每个数据是不是Object/Array,然后是否要继续遍历

function clone(target) {
  // 进行克隆
  let result, checkType = targetType(target); // 获取当前数据的类型的
  // 判断
  if (checkType === 'Object') {
    result = {}
  } else if (checkType === 'Array') {
    result = []
  } else {
    return result
}

// 遍历进行克隆
for (let i in target) {
  let value = target[i]
  if (targetType(value) === 'Object' || targetType(value) === 'Array') {
    result[i] = clone(value)
  } else {
    result[i] = value
  }
}
// 最终把克隆后的数据要返回
return result;
}

// 深拷贝
let arr = [1, 2, [10, 20], { name: '小明', age: 100 }];
let result = clone(arr);
result[3]['name'] = '酷酷姐';
console.log(arr);
console.log(result);

相关文章

  • js 浅拷贝和深拷贝

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

  • JS如何实现深度拷贝(克隆)

    深拷贝(深度克隆)的特点:拷贝的时候生成新数据,修改拷贝以后的数据不会影响原数据。拷贝的数据里如果有对象或者数组,...

  • js克隆

    实现 js 深度克隆 执行结果如下:

  • js公共函数总结

    字节大小转换 Object 对象的深度克隆(深拷贝) 时间格式化 js利用空对象作为中介实现继承 需求:get请求...

  • iOS面试基础一

    #父类实现深拷贝时,子类如何实现深度拷贝.父类没有实现深拷贝时,子类如何实现深度拷贝.# <(1)深拷贝同浅拷贝的...

  • 五、面试总结(五)

    对象 拷贝(clone) 如何实现对象克隆 深拷贝和浅拷贝区别 深拷贝和浅拷贝如何实现激活机制 写clone()方...

  • 深拷贝、浅拷贝

    父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 深拷贝同浅拷贝的区别:浅拷贝...

  • 面试题整理

    父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 深拷贝同浅拷贝的区别:浅拷贝...

  • 0. iOS面试题基础篇

    1. 父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 1.1 深拷贝同浅拷贝...

  • iOS基础知识点01

    1. 父类实现深拷贝时,子类如何实现深度拷贝。父类没有实现深拷贝时,子类如何实现深度拷贝。 1.1 深拷贝同浅拷贝...

网友评论

      本文标题:JS如何实现深度拷贝(克隆)

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