深拷贝的方法

作者:有用网 阅读量:235 发布时间:2023-10-18
关键字 JavaScript

实现对象深拷贝的五种方法

1.为什么需要深拷贝。

  当项目需要修改某组数据的内容并不改变原数据时,就需要深拷贝一份出来,在上面修改。

2.深拷贝方法

(一).json转化

通过JSON.stringify() 和 JSON.parse() 将对象转为字符串之后在转为对象。

局限性:当拷贝的数据为 undefined、function、symbol会在转换过程中被忽略。

var obj = {name:'123'}
var obj2 = JSON.parse(JSON.stringify(obj))

(二)es6扩展运算符

局限性:只能深度拷贝对象的第一层,如果对象中的属性也是对象的话,没有办法进行深度拷贝的。

var obj = {name:'123',age:13};
var obj2 = {...obj}

(三)for in 循环遍历对象

局限性:只能深度拷贝对象的第一层,如果对象中的属性也是对象的话,没有办法进行深度拷贝的。

var obj = {
  name: "小明",
  age: 20
}
var obj1 = {}
for (var key in obj) {
  //遍历属性值,深拷贝
  obj1[key] = obj[key]
}

(四)Object.assign() 对象的合并

利用Object.assign(), 第一个参数必须是空对象

局限性:只能深度拷贝对象的第一层,如果对象中的属性也是对象的话,没有办法进行深度拷贝的。

var obj = {name:'123',age:13};
var obj2 = Object.assign({},obj1);

(五)利用循环和递归的方式

在循环递归中需要注意设置临界值(typeof obj[key] == ‘object’),否则会造成死循环。
循环递归可以处理对象中嵌套数组或对象的问题。相当于第三种方法的优化。

function deepClone(obj, newObj) {
  var newObj = newObj || {};
  for (let key in obj) {
      if (typeof obj[key] == 'object') {
          newObj[key] = (obj[key].constructor === Array) ? [] : {}
          deepClone(obj[key], newObj[key]);
      } else {
          newObj[key] = obj[key]
      }
  }
  return newObj;
}

#发表评论
提交评论