JS合并数组对象中重复数据[通俗易懂]

JS合并数组对象中重复数据[通俗易懂]数组重组数据源数据:目标数据://源数据varoldData=[{city_id:1,city_name:’北京’,city_img:”http://dfknbdjknvkjsfnvlkjdn.png”,city_country:”中国”},{city_id:2,city_name:’上海’,city_img:”http://wergerbe.png”,city_country

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

数组重组数据
源数据:
在这里插入图片描述
目标数据:
在这里插入图片描述

// 源数据
var oldData = [
  { 
   
    city_id: 1,
    city_name: '北京',
    city_img: "http://dfknbdjknvkjsfnvlkjdn.png",
    city_country: "中国"
  },
  { 
   
    city_id: 2,
    city_name: '上海',
    city_img: "http://wergerbe.png",
    city_country: "中国"
  },
  { 
   
    city_id: 3,
    city_name: '广州',
    city_img: "http://hrthhr.png",
    city_country: "中国"
  },
  { 
   
    city_id: 4,
    city_name: '西雅图',
    city_img: "http://frevfd.png",
    city_country: "美国"
  },
  { 
   
    city_id: 5,
    city_name: '纽约',
    city_img: "http://反而个.png",
    city_country: "美国"
  }
]
 
// 把源数据先变成目标数据的规则
var oldDataRule = []
oldData.forEach(el => { 
   
  var oldObj = { 
   
    name: el.city_country,
    citys:[]
  }
  var cityObj = { 
   
    city_name: el.city_name,
    city_img: el.city_img,
    city_id: el.city_id
  }
  oldObj.citys.push(cityObj)
  oldDataRule.push(oldObj)
})
 
/** * 先去重,后合并 * 1、源数据去重 * 2、把去重后的数据和源数据中相同name的数据合并citys */
var newData = []
var newObj = { 
   }
oldDataRule.forEach((el, i) => { 
   
  if (!newObj[el.name]) { 
   
    newData.push(el);
    newObj[el.name] = true;
  } else { 
   
    newData.forEach(el => { 
   
      if (el.name === oldDataRule[i].name) { 
   
        el.citys = el.citys.concat(oldDataRule[i].citys);
        // el.citys = [...el.citys, ...oldDataRule[i].citys]; // es6语法
      }
    })
  }
})
console.log(newData); // 目标数据

Jetbrains全家桶1年46,售后保障稳定

结果:
在这里插入图片描述

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

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/226716.html原文链接:https://javaforall.net

(0)
上一篇 2025年6月26日 上午11:22
下一篇 2025年6月26日 下午12:01


相关推荐

  • Pycharm安装在Linux系统中

    Pycharm安装在Linux系统中Pycharm 安装在 Linux 系统中 Pycharm 安装在 Linux 系统中 1 下载安装包 linux 的安装包是以 tar gz 格式的 2 解压下载好的安装包并安装 3 使用安装好的 pycharm 运行一下自带的程序报错了 错误信息为 Failedtocrea 原因是 ubuntu18 04 默认没有安装 setuptools 解决办法 在新的终端执行下面命令 然后运行程序又报错了 不要紧 选择一个 python 的解析器即可 由于上一次已经安装了 Anacond 所以使用 Anac

    2026年3月27日
    3
  • MySQL索引的使用实例

    MySQL索引的使用实例前言这是我听老师讲课做的笔记,考试要看的。这是视频地址作者:陈运智关注我的csdn博客,更多Linux笔记知识还在更新本人只在csdn写博客配套这篇文章观看效果更佳MySQL索引的使用实例一.慢查询日志二.查询分析器——explain三.索引的基本使用四.复合索引五.覆盖索引一.慢查询日志//查看是否开启慢查询日志mysql>showvariableslike’%slow%’;//临时开启慢查询日志mysql>setglobalslow_q

    2022年6月24日
    26
  • MySQL Blob类型

    MySQL Blob类型MySQL 中 Blob 是一个二进制大型对象 是一个可以存储大量数据的容器 它能容纳不同大小的数据 插入 Blob 类型的数据必须使用 PreparedStat 因为 Blob 类型的数据无法使用字符串拼接写的 MySQL 的四种 Blob 类型 除了在存储的最大信息量上不同外 他们是等同的 类型 大小 单位 字节 TinyBlod 最大 255 Blod 最大 65K MediumBlob 最大 16M LongBlob 最大 4G 实际使用中根据需要存入

    2026年3月17日
    1
  • JS闭包的理解

    JS闭包的理解闭包的简介 闭包就是能够读取其他函数内部变量的函数 只有函数内部的子函数才能读取局部变量 在本质上 闭包是函数内部和函数外部连接起来的桥梁 闭包的定义 如果在一个内部函数里 对在外部作用域 但不是全局作用域 的变量进行引用 那么内部函数就被认为是闭包 closure 闭包的特点 可以读取自身函数外部的变量 沿着作用域链寻找 先从自身开始查找 如果自身没有才会继续往上级查找 自身如果拥

    2026年3月26日
    2
  • 学习redis实现分布式锁—–自己的一个理解

    学习redis实现分布式锁—–自己的一个理解

    2021年7月10日
    85
  • datahub文档_Datahub安装部署指南

    datahub文档_Datahub安装部署指南Datahub 安装部署指南系统要求 windowsserve 及以上 64 位操作系统 安装目标磁盘空间至少 20G 以上 日志文件需要 网络要求 一个 dmp 平台可以访问到的端口 安装文件下载地址 部署过程一 下载 Datahub 安装文件 windows64 位 解压 Datahub 压缩文件 包括 3 个文件 1 dmp datahub 1 0 0 windows amd64 exe D

    2026年3月18日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号