美文网首页
JS深浅拷贝常用方法

JS深浅拷贝常用方法

作者: 他在写的 | 来源:发表于2019-03-12 15:53 被阅读0次

浅拷贝:

浅拷贝出现原因

let a = {
    name:'Jack',
    age:'10'
  };
  let b = a;
  a.name = 'Wang';
  console.log(a.name);//Wang
  console.log(b.name);//Wang

上述代码中,如果我们希望a和b的属性是独立的,那么最后结果显然不符期望,
简单来说发生原因:引用类型,栈内存存放指针,内容在堆内存中,赋值时只拷贝了指针。

**浅拷贝常用方法
1.Object.assign()

let shallowA = {
    name:'Jack',
    age:10
  };
  let shallowB = Object.assign({},shallowA);
  shallowA.name = 'Zhang';
  console.log(shallowA.name);//Zhang
  console.log(shallowB.name);//Jack

2.三点运算符

let shallowC = {...shallowA};
  shallowA.age = 11;
  console.log(shallowA.age);//11
  console.log(shallowC.age);//10

深拷贝

深拷贝出现原因

let c = {
    name:'June',
    family:{
      mother:'Lily',
      father:'Bob'
    },
    age:12
  }
  let d = {...c};
  let e = Object.assign({},c);
  c.family.mother = 'Venessa';
  console.log(c.family);//mother:'Venessa' 
  console.log(d.family);//mother:'Venessa' 
  console.log(e.family);//mother:'Venessa' 

简单来说,对于这种对象中仍有对象的情况,就需要使用深拷贝了

深拷贝常用方法
1.JSON.parse(JSON.stringfy(object))

let deepA = {
    age: 1,
    jobs: {
    first: 'FE'
    }
  };
  let deepB = JSON.parse(JSON.stringify(deepA));
  deepA.jobs.first = 'Ali';
  console.log(deepA.jobs);//Ali
  console.log(deepB.jobs);//FE

这种方法是利用JSON序列化和反序列化方法将内容完全展开,但是它仍有局限性:
1.会忽略 undefined
2.会忽略 symbol
3.会忽略 函数
4.不能解决循环引用的对象(obj.a = obj.b obj.c.d = obj.a等)

使用lodash的deepClone()
lodash库中的deepClone函数。

相关文章

  • JS深浅拷贝常用方法

    浅拷贝: 浅拷贝出现原因 上述代码中,如果我们希望a和b的属性是独立的,那么最后结果显然不符期望,简单来说发生原因...

  • JS深浅拷贝方法分享

    稍微有点js对象拷贝经验的朋友都知道,直接将对象A赋值给对象B,然后修改对象B中的某个值,对象A中对应的那个值也会...

  • JS文集的目录

    js基础心法 深浅拷贝(递归)深浅拷贝(首层浅拷贝) js 数据处理 数组对象查找的常见操作数组对象去重的常见操作...

  • js的深浅拷贝

    js的深浅拷贝可以分为数组的深浅拷贝和对象的深浅拷贝 一、数组的深浅拷贝如果只是简单的将数组中的元素付给另外一个数...

  • js深浅拷贝

    项目中,一般会用loadsh库,地址:https://github.com/lodash/lodash 浅拷贝方法...

  • js 深浅拷贝

    浅拷贝 是 把对象或者数组的第一层 key 或者 索引 赋到 新的 对象或者对象上 深拷贝是迭代浅拷贝的操作,也就...

  • js 深浅拷贝

    深拷贝 更好的写法: 浅拷贝 浅拷贝,还可以用 Object.assign 、展开运算符 ...

  • JS深浅拷贝

  • JS深浅拷贝

    JS存储方式 JS中存在基本数据类型和引用数据类型1.基本数据类型:number,string,boolean,n...

  • JS深浅拷贝

    浅拷贝 浅拷贝的意思就是只复制引用,而未复制真正的值。 深拷贝 深拷贝就是对目标的完全拷贝,不像浅拷贝那样只是复制...

网友评论

      本文标题:JS深浅拷贝常用方法

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