var arr2=[{id:1,name:'23'}]
var arr1=[{id:1,car:'car2'}]
const combined = arr2.reduce((acc, cur) => {
const target = acc.find(e => e.id === cur.id);
console.log(target)
if (target) {
Object.assign(target, cur);
} else {
acc.push(cur);
}
return acc;
}, arr1);
console.log(combined);

arr2.reduce(function(acc,cur),arr1):reduce方法传入的函数的第一个参数acc是数组元素的累计值,reduce方法的第二参数arr1是指定累计值acc的初始值。

所以一开始acc的值就是arr1,cur的值是arr2[0].

const target = acc.find(e => e.id === cur.id); target返回的是在arr1中id与arr2[0].id值相同的对象:即{id:1,name:'23'}

例如var target = [{id:1},{id:2}].find(e=> e.id==1)//target的值为{id:1}

Object.assign(target, cur)//将cur中的值复制到target中,若是相同属性就覆盖,若是不同属性就添加

例如:Object.assign({id:1,name:'23'},{id:1,car:'car1'})//结果是得到对象{id: 1, name: "23", car: "car1"}

上面if...else...语句的意思就是,在arr1数组中找到了与arr2数组元素相同的id的就合并,没有找到就讲arr2数组的该元素push到arr1数组中,最后得到的acc及arr1与arr2合并后的数组。

一道题目学ES6 API,合并对象id相同的两个数组对象的更多相关文章

  1. 续~ES6 新语法 (symbol、set集合、 数组对象的filter(),reduce(),weakset(),map()方法)

    一.symbol 回顾数据类型: 基本类型(原始类型): String Number Boolean Undifined Null Symbol 引用类型: Objects 1.1 创建symbol ...

  2. js 合并两个数组对象

    项目背景是合并a = [{name:'dede'},{name:'jenny'}],  b = [{age:18},{age:19}]  合并成[{name:'dede',age:18},{name: ...

  3. js两个数组对象通过相同元素匹配筛选

    let a = [ { name: 'joy', year: '24' }, { name: 'eve', year: '25' } ] let b = [ { name: 'joy', city: ...

  4. JQ 数组动态添值,对象动态添值,判断数组/对象是否为空

    1.数组动态添值 首先声明一个空数组:var data = new Array(); 向数组中添值 :data.push('添加的值'); 示例:

  5. js 两个数组对象根据账号比较去重,解决直接splice后数组索引改变

    目的获取Arr2中不包含在arr1中的对象 根据Account进行比较,如果相等则删除tempArr数组对象. 结果返回张三 var arr1=[{"account":" ...

  6. JS深度判断两个数组对象字段相同

    /** * 判断此对象是否是Object类型 * @param {Object} obj */ function isObject(obj){ return Object.prototype.toSt ...

  7. JavaScript把两个数组对象合并成一个一一对应的数组对象

    合并数组或者对象在数组或对象前面加...,是es6的新写法,然后数组的map方法会返回数组. var obj1 = [{ , "model": "XQG70-S1208F ...

  8. NodeList类数组对象: HTMLCollection , NamedNodeMap,两套API(childNodes , children)

    快捷键:leishuzuduixiang(类数组对象)  bianlijiedian(遍历节点)  jiedian(节点)  htmlcollection , namednodemap , nodel ...

  9. js- 类数组对象

    JavaScript中,数组是一个特殊的对象,其property名为正整数,且其length属性会随着数组成员的增减而发生变化,同时又从Array构造函数中继承了一些用于进行数组操作的方法. 而对于一 ...

随机推荐

  1. hdu 1028 Ignatius and the Princess III(母函数)

    题意: N=a[1]+a[2]+a[3]+...+a[m];  a[i]>0,1<=m<=N; 例如: 4 = 4;  4 = 3 + 1;  4 = 2 + 2;  4 = 2 + ...

  2. C++ 指针的引用和指向引用的指针

    指向引用的指针 简单使用指针的一个例子就是: int a = 1; int *p = &a; 预先强调: 没有指向引用的指针 原因: 因为引用 不是对象,没有地址. 但是指向引用的指针是什么形 ...

  3. 权限控制-RBAC(Role-Based Access Control)

    RBAC是基于角色的权限访问控制,在RBAC中角色与权限相连,用户通过成为某个角色而得到角色的权限,这就极大的简化了权限的管理,用户和角色多对多,角色和权限多对多,由此产生用户表.角色表.权限表,用户 ...

  4. coding game, 边打游戏边学编程,是一种怎么样的体验?

    前言 hello,大家好,我是bigsai,好久不见,甚是想念! 在日常生活中,很多人喜欢玩游戏,因为游戏中有着对抗博弈.控制的喜悦,用灵魂指法完成一波靓丽的操作. 但实际上,你的按键都是对应代码中一 ...

  5. @RestController注解的作用

    原文出自"https://www.cnblogs.com/yaqee/p/11256047.html" 一.在Spring中@RestController的作用等同于@Contro ...

  6. 大爽Python入门教程 1-5 答案

    大爽Python入门公开课教案 点击查看教程总目录 1 方向变换 >>> 51//4 12 >>> 51%4 3 答: 向左转51次之后, 小明面朝东方, 转过了1 ...

  7. HTTP1.1 Keep-Alive到底算不算长连接?

    在基础架构部沉浸了半年,有一些认知刷新想和童靴们交代一下, 不一定全面,仅代表此时的认知, 也欢迎筒靴们提出看法. 本文聊一聊口嗨用语:"长连接.短连接", 文章会按照下面的思维导 ...

  8. ndarray 数组的创建和变换

    ndarray数组的创建方法 1.从python中的列表,元组等类型创建ndarray数组 x = np.array(list/tuple) x = np.array(list/tuple,dtype ...

  9. myeclipse trial expired暂时解决办法

    运行以下程序,生成key: import java.io.*; public class MyEclipseGen { private static final String LL = "D ...

  10. [luogu7418]Counting Graphs P

    参考[luogu7417],同样求出最短路,得到二元组$(x,y)$并排序,记$tot_{(x,y)}$为$(x,y)$的数量 其中所给的两个条件,即分别要求: 1.$(x,y)$只能和$(x\pm ...