前言

提示:本文仅总结 自己 平时 使用的 几种合并 对象的方法:

总结

一、Object.assign()
同名属性会被覆盖
Object.assign种第一个值是目标对象,第二个值是源对象

说明:
1、Object.assign() 支持多个对象合并,如果不想修改目标对象,可以将目标对象改成空对象 {}
2、来源对象往目标对象合并,返回目标对象。如果目标对象、来源对象属性中有相同键时,来源对象中的属性替换目标对象中的属性,可以理解成后面替换前面属性中的键。

const obj1={a:"1",b:"2"}
const obj2={c:"3",d:"4"}
const value= Object.assign(obj1,obj2)
//console.log(value)

注意:
1、使用该方法时,需提前判断原生Object是否支持该函数。
2、如果原生Object不支持该函数,则需创建函数assign,使用Object.defineProperty将该函数绑定到Object上
3、判断参数是否正确。
4、一定要注意:目标对象不能为空,我们可以直接设置{}传递进去,但必须设置值。

二、扩展运算符

扩展运算符合并对象obj1对象在前和在后最后打印的结果是不同的
const obj1={a:"1",b:"2"};
const obj2={b:"3",c:"4"};
const value= {...obj1,...obj2};
//console.log(value)
//a:1 b:3 c:4    
// obj1中b的值被后面传入的obj2的值给覆盖掉了

三、lodash.merge
注:使用 lodash.merge 方法前 ,需先将lodash工具库引入

<script src="lodash工具库地址">
</script>

注:在使用中我们通常使用_来代替lodash

const obj1={a:"1",b:"2"};
const obj2={b:"3",c:"4"};
const value= _.merge(obj1,obj2);
//console.log(value)
//a:1 b:3 c:4    

四、lodash.assign
注:使用 lodash.assign方法前 ,需先将lodash工具库引入

<script src="lodash工具库地址">
</script>

注:在使用中我们通常使用_来代替lodash

const obj1={a:"1",b:"2"};
const obj2={b:"3",c:"4"};
const value= _.assign(obj1,obj2);
// console.log(value)
//a:1 b:3 c:4    

说明:以上几种方法 需结合 自己项目的使用情况,然后判断具体哪种方法适用,并且可以解决自己在项目中遇到的问题,本次自己是使用第一种方法(Object.assign)解决了自己遇到的问题。

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐