首页 > Web开发 > 详细

前端小知识(10)--js深拷贝

时间:2020-07-06 16:57:27      阅读:74      评论:0      收藏:0      [点我收藏+]

JavaScript 深拷贝

浅拷贝和深拷贝的区别

首先,需要明白在赋值的时候有个传值和传址的区别。在JavaScript中,简单数据类型(null,undefined,string,number,boolean)在赋值的时候,其实是传值,而对象类型object(包括[],{},function,Date(),RegExp()等)都是传址。

对于深拷贝而言,所有的值都需要重新开辟内存空间,而不是传递内存地址。

深拷贝的实现

1. Object.assign({}, obj)

let user = {
  name: ‘张三‘
}
let userCopy = Object.assign({}, user)

缺点:只对第一级的变量是深拷贝

2. JSON.parse(JSON.stringify(obj))

优点:简单

缺点:无法拷贝正则表达式,undefined,function,null

3. {...obj}

let user = {
  name: ‘张三‘,
  age: undefined
}
let userCopy = {...user}
user.name = "李四"
console.log(JSON.stringify(user))
console.log(JSON.stringify(userCopy))

// output
// {"name":"李四"}
// {"name":"张三"}

优点:简单

缺点:只是对于第一级的变量是深拷贝

4. 递归

function deepCopy(obj){
  let res = (obj instanceof Array ? [] : {});
  for (const [k, v] of Object.entries(obj)) {
    res[k] = (typeof v == "object" ? deepCopy(v) : v);
  }
  return res;
}

优点:对于数组、对象、函数都可以支持,支持null,undefined

缺点:对于Date(),RegExp()无法支持,可以添加对于类型的判断以实现实际情况中的深拷贝需求

前端小知识(10)--js深拷贝

原文:https://www.cnblogs.com/njuclc/p/13255194.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!