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. songwenxin

    # -*- coding: utf-8 -*- import wx from modelmngr_frame import MyFrame1 ############################# ...

  2. c#复制数组的多种方法

    方法一:使用for循环 int []pins = {9,3,7,2} int []copy = new int[pins.length]; for(int i =0;i!=copy.length;i+ ...

  3. nodejs:使用puppeteer在服务器中构建一个获取电影电视剧剧集的接口

    首先我们看下数据来源: 来源于这个网站:https://z1.m1907.cn/ 可以说这个网站上能找到很多你想看的很多电影或电视剧,最重要的是很多电影电视剧在别的网站是收费的,但是在这里看是免费的, ...

  4. WPF进阶技巧和实战03-控件(3-文本控件及列表控件)

    系列文章链接 WPF进阶技巧和实战01-小技巧 WPF进阶技巧和实战02-布局 WPF进阶技巧和实战03-控件(1-控件及内容控件) WPF进阶技巧和实战03-控件(2-特殊容器) WPF进阶技巧和实 ...

  5. ICMP 协议仿真及ping命令用途

    1.实验目的 加深对 IPv4 协议首部各定义域的理解,掌握路由表的结构和基本配置命令,熟悉 ICMP 的调试操作. 2.实验原理 IPv4 协议定义,网络层协议的相关 RFC 定义和描述. 3.实验 ...

  6. MySQL怎么缓解读的压力的?---buffer pool

    每当我们想要缓解读,一般会想到什么? 预读取,缓存 缓存 缓存,其实就是将高频访问的数据放到内存里面,减少读盘的次数. 为了提高内存的利用率,MySQL还建立了缓存池,也就是buffer pool,存 ...

  7. 装了这几个IDEA插件,基本上一站式开发了!

    前言 前几天有社区小伙伴私聊我,问我都用哪些IDEA插件,我的IDEA的主题看起来不错. 作为一个开源作者,每周要code大量的代码,提升日常工作效率是我一直追求的,在众多的IDEA插件中,我独钟爱这 ...

  8. 一文带你理解TDengine中的缓存技术

    作者 | 王明明,涛思数据软件工程师 小 T 导读:在计算机系统中,缓存是一种常用的技术,既有硬件缓存,比如我们经常听到的 CPU L2 高速缓存,也有软件缓存,比如很多系统里把 Redis 当做数据 ...

  9. redis学习笔记(详细)——高级篇

    redis学习笔记(详细)--初级篇 redis学习笔记(详细)--高级篇 redis配置文件介绍 linux环境下配置大于编程 redis 的配置文件位于 Redis 安装目录下,文件名为 redi ...

  10. 『学了就忘』Linux基础命令 — 37、Linux中挂载操作的相关命令

    目录 1.mount命令介绍 (1)mount命令说明 (2)mount命令格式 2.mount命令示例 3.mount -a命令说明 4.-o特殊选项说明 5.exec/noexec选项说明 挂载就 ...