微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

VUE的两个或多个对象拷贝

浅谈object.assign与deepmerge

object.assign(浅拷贝)

用于对象的合并,将源对象的属性,复制到目标对象中

	  let target = {a:1}
      const target1 = {a:2,b:2,map:{file1:"test1",file2:"test2"}};
      const target2 = {c:3,map:{file1:"test1"}};
      Object.assign(target,target1,target2)
      //target={"a":2,"b":2,"map":{"file1":"test1"},"c":3}

Object.assign方法的第一个参数是目标对象,后面的参数都是源对象;

注:

  1. Object.assign只能做到对象的浅合并,即第一层属性的合并;
  2. 遇到同名属性,Object.assign的处理方法是替换:如果目标对象与源对象有同名属性,则目标对象中该属性会被覆盖,即后面(右边)的属性会覆盖前面(左边)的属性
const target1 = {a:1,map:{file1:"test1",file2:"test2"}};
const target2 = {b:2,map:{file3:"test3"}};
Object.assign(target1,target2)

得到的结果是:
{“a”:2,“b”:2,“map”:{“file3”:“test3”}}
而不是:
{“a”:2,“b”:2,“map”:{“file1”:“test1”,“file2”:“test2”,“file3”:“test3”}}

当对象是多层结构的时候,以上拷贝方式往往达不到我们所想要的效果,此时就需要深层拷贝,可以采取循环方式,进行多次多次浅层拷贝,但是这样会比较繁琐,在这比较推荐deepmerge(深层拷贝)

deepmerge(深层拷贝)

1.安装

npm install deepmerge

2.使用

import merge from 'deepmerge'

const obj = merge(obj1, obj2)

3.示例

const target1 = {a:1,map:{file1:"test1",file2:"test2"}};
const target2 = {b:2,map:{file3:"test3"}};
const obj = merge(target1 , target2 )

//结果:{"a":2,"b":2,"map":{"file1":"test1","file2":"test2","file3":"test3"}}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐