js合并两个数组中同一类型的type对象_给定一个数组,要求根据type合并-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_43866678/article/details/128655174

文章展示了如何使用JavaScript的map和find方法将接口返回的数据与预定义的数组中的对象按type属性进行合并，以创建一个新的数组。合并后的新数组包含了原数据的属性以及从定义数组中匹配到的type对应的其他属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// js合并两个数组中同一类型的type对象
// 接口返回的数据格式
[
	{
		dayAt: "2023-01-11"
		lastAt: "2023-01-11 14:36:34"
		subTitle: "简历待筛选"
		subTitleEn: "wait_hr_es_screen"
		title: "待办消息"
		titleEn: "wait"
		unreadCount: "2"
	},
	{
		dayAt: "2023-01-11"
		lastAt: "2023-01-11 09:00:17"
		subTitle: "审批通知"
		subTitleEn: "approval_notice_200029930064"
		title: "审批消息"
		titleEn: "approval"
		unreadCount: "2"
	}
]
// data中定义的数组格式
    noticeList: [
      {src: require('@/assets/images/notice/notice1.png'),type:'crm', title:'CRM消息'},
      {src: require('@/assets/images/notice/notice2.png'),type:'wait', title:'待办消息'},
      {src: require('@/assets/images/notice/notice3.png'),type:'task', title:'任务消息'},
      {src: require('@/assets/images/notice/notice4.png'),type:'msg', title:'日程消息'},
      {src: require('@/assets/images/notice/notice5.png'),type:'train', title:'商学院消息'},
      {src: require('@/assets/images/notice/notice6.png'),type:'approval', title:'审批消息'},
      {src: require('@/assets/images/notice/notice7.png'),type:'assist', title:'协作人消息'},
      {src: require('@/assets/images/notice/notice8.png'),type:'transfer', title:'转移消息'},
      {src: require('@/assets/images/notice/notice9.png'),type:'hr', title:'招聘消息'},
    ],
 // 合并
  	const arrs = res.data.map(item => {
	   const data = this.noticeList.find(i => item.titleEn == i.type)
	   return {
	     ...item,
	     ...data
	   }
	 })
	this.noticeList = arrs
 	console.log(arrs)
 打印结果如下：

在这里插入图片描述