草庐IT

js去掉两个数组相同的元素、js删除数组中某一个对象、js快速查找数组中重复项下标

伟笑 2023-05-14 原文

一、js去掉两个数组相同的元素

注意:这里并非是数组去重,数组去重是去掉一个数组中相同的元素,这里是比较两个数组,过滤掉二者相同的,留下不同的。

通过 some() 在对方数组里面查找相同元素,再利用filter() 过滤掉当前数组里与对方数组相同的元素。

const arr1 = [1, 2, 3, 56]
const arr2 = [1, 2, 3, 780]
const res = arr2.filter(item1 => !arr1.some(item2 => item2 === item1))
console.log(res); // [780]

arr2 与 arr1相同的元素有 1,2,3 ,res的结果就是 780

const res2 = arr1.filter(item1 => !arr2.some(item2 => item2 === item1))
console.log(res2); // [56]

如果是数组对象(同上,查找对象 id 属性)

 let arr1 = [
   {id:1,name:'小明',age:18},
   {id:2,name:'小红',age:16},
   {id:4,name:'小紫',age:22},
   {id:5,name:'小绿',age:20},
 ]
 
 let arr2 =[
   {id:2,sex:'女'},
   {id:5,sex:'男'},
 ]
let newArr = arr1.filter((item) => !arr2.some((ele) => ele.id === item.id));

打印结果:

还可利用 includes

let getId = arr2.map(item=>item.id)
let newArr2 = arr1.filter(item=>!getId.includes(item.id))

打印结果:

二、js删除数组中某一个对象

let arr1 = [
   {id:1,name:'小明',age:18},
   {id:2,name:'小红',age:16},
   {id:4,name:'小紫',age:22},
   {id:5,name:'小绿',age:20},
 ]
 //假设 去掉name为小明的 这条数据
 arr.splice(
	arr.indexOf(arr.find((e) => { 
		return e.name=== "小明"; }
		)
), 1);

参考:https://blog.csdn.net/weixin_43743175/article/details/125257773

三、js快速查找数组中重复项下标

	var ARR = [1,2,3,4,5,1,2];
	var rep = [];
	ARR.forEach((item,index)=>{
		if(ARR.indexOf(item)!=index){
			rep.push(ARR.indexOf(item),index)
		}
	})	

打印结果:

参考:https://blog.csdn.net/smz8023/article/details/86164751

例子:

假如后台返回了个这样的简单数据:

list: [
    { totalNum: 1000, touchNum: 300, kpiName: '浏览量', itemStyleColor: ['#4CA4EC', '#B6D9F6'] },
    { totalNum: 2000, touchNum: 600, kpiName: '任务领取个数', itemStyleColor: ['#624cec', '#b6bbf6'] }
    { totalNum: 3232, touchNum: 800, kpiName: '浏览量', itemStyleColor: ['#4CA4EC', '#B6D9F6'] }
  ]

而前端需要下面这样的数据结构,后端不好处理,让前端处理

list: [
  {
    chartList: [
      { totalNum: 1000, touchNum: 300, kpiName: '浏览量', itemStyleColor: ['#4CA4EC', '#B6D9F6'] },
      { totalNum: 2000, touchNum: 600, kpiName: '任务领取个数', itemStyleColor: ['#624cec', '#b6bbf6'] }
    ],
    groupName: '寿险公司',
    groupId: 'gruop1'
  },
  { chartList: [{ totalNum: 3232, touchNum: 800, kpiName: '浏览量', itemStyleColor: ['#4CA4EC', '#B6D9F6'] }], groupName: '电商公司', groupId: 'group2' }
],

思路:根据某种规律,先拆分数据,采用 总-分-总 的模式,遇到难解决的数据分类拆分-最后合并。

参考实现:

/**
     * @Description: 机构数据整理
     * @param {*Array} list 目标数据
     * @return {*Array} 最终数据
     */
    matchFun(list) {
      const typeColor1 = ['#624cec', '#b6bbf6']
      const typeColor2 = ['#4CA4EC', '#B6D9F6']

      let arr1 = [] //转发
      let arr2 = [] //浏览
      let chartObj
      let newList = []
      list.forEach((item, index) => {
        if (item.type == 1) {
          arr1.push(item)
        } else if (item.type == 2) {
          arr2.push(item)
        }
      })

      for (let index = 0; index < arr1.length; index++) {
        chartObj = { chartList: [] }
        const element1 = arr1[index]
        chartObj.groupName = element1.groupName
        chartObj.groupId = element1.groupId
        for (let j = 0; j < arr2.length; j++) {
          const element2 = arr2[j]
          if (element1.groupId === element2.groupId) {
            chartObj.chartList[0] = element2
            chartObj.chartList[1] = element1
          }
        }
        newList.push(chartObj)
        newList.forEach((item) => {
          item.chartList.forEach((itm) => {
            itm.itemStyleColor = itm.type == '1' ? typeColor1 : typeColor2
          })
        })
        newList = newList.filter((item) => item.chartList.length > 0)
      }

      /处理单个图表数据//

      let arrSet1 = [] //去重后的单个指标图表
      let arrSet2 = []
      arrSet1 = arr1.filter((item) => !arr2.some((ele) => ele.groupId == item.groupId))
      arrSet2 = arr2.filter((item) => !arr1.some((ele) => ele.groupId == item.groupId))

      arrSet1.forEach((item) => {
        let chartList = [{}]
        item.chartList = chartList
        item.chartList[0] = { itemStyleColor: item.type == '1' ? typeColor1 : typeColor2, checkId: item.checkId, groupId: item.groupId, type: item.type, total: item.total, num: item.num }
      })
      arrSet2.forEach((item) => {
        let chartList = [{}]
        item.chartList = chartList
        item.chartList[0] = { itemStyleColor: item.type == '1' ? typeColor1 : typeColor2, checkId: item.checkId, groupId: item.groupId, type: item.type, total: item.total, num: item.num }
      })

      // 最后合并二者
      newList = [...newList, ...arrSet1, ...arrSet2]

      return newList
    }

有关js去掉两个数组相同的元素、js删除数组中某一个对象、js快速查找数组中重复项下标的更多相关文章

  1. ruby - 如何从 ruby​​ 中的字符串运行任意对象方法? - 2

    总的来说,我对ruby​​还比较陌生,我正在为我正在创建的对象编写一些rspec测试用例。许多测试用例都非常基础,我只是想确保正确填充和返回值。我想知道是否有办法使用循环结构来执行此操作。不必为我要测试的每个方法都设置一个assertEquals。例如:describeitem,"TestingtheItem"doit"willhaveanullvaluetostart"doitem=Item.new#HereIcoulddotheitem.name.shouldbe_nil#thenIcoulddoitem.category.shouldbe_nilendend但我想要一些方法来使用

  2. ruby-on-rails - 按天对 Mongoid 对象进行分组 - 2

    在控制台中反复尝试之后,我想到了这种方法,可以按发生日期对类似activerecord的(Mongoid)对象进行分组。我不确定这是完成此任务的最佳方法,但它确实有效。有没有人有更好的建议,或者这是一个很好的方法?#eventsisanarrayofactiverecord-likeobjectsthatincludeatimeattributeevents.map{|event|#converteventsarrayintoanarrayofhasheswiththedayofthemonthandtheevent{:number=>event.time.day,:event=>ev

  3. ruby-on-rails - 在 Ruby 中循环遍历多个数组 - 2

    我有多个ActiveRecord子类Item的实例数组,我需要根据最早的事件循环打印。在这种情况下,我需要打印付款和维护日期,如下所示:ItemAmaintenancerequiredin5daysItemBpaymentrequiredin6daysItemApaymentrequiredin7daysItemBmaintenancerequiredin8days我目前有两个查询,用于查找maintenance和payment项目(非排他性查询),并输出如下内容:paymentrequiredin...maintenancerequiredin...有什么方法可以改善上述(丑陋的)代

  4. ruby - 多次弹出/移动 ruby​​ 数组 - 2

    我的代码目前看起来像这样numbers=[1,2,3,4,5]defpop_threepop=[]3.times{pop有没有办法在一行中完成pop_three方法中的内容?我基本上想做类似numbers.slice(0,3)的事情,但要删除切片中的数组项。嗯...嗯,我想我刚刚意识到我可以试试slice! 最佳答案 是numbers.pop(3)或者numbers.shift(3)如果你想要另一边。 关于ruby-多次弹出/移动ruby​​数组,我们在StackOverflow上找到一

  5. ruby - 使用 Vim Rails,您可以创建一个新的迁移文件并一次性打开它吗? - 2

    使用带有Rails插件的vim,您可以创建一个迁移文件,然后一次性打开该文件吗?textmate也可以这样吗? 最佳答案 你可以使用rails.vim然后做类似的事情::Rgeneratemigratonadd_foo_to_bar插件将打开迁移生成的文件,这正是您想要的。我不能代表textmate。 关于ruby-使用VimRails,您可以创建一个新的迁移文件并一次性打开它吗?,我们在StackOverflow上找到一个类似的问题: https://sta

  6. ruby - 将数组的内容转换为 int - 2

    我需要读入一个包含数字列表的文件。此代码读取文件并将其放入二维数组中。现在我需要获取数组中所有数字的平均值,但我需要将数组的内容更改为int。有什么想法可以将to_i方法放在哪里吗?ClassTerraindefinitializefile_name@input=IO.readlines(file_name)#readinfile@size=@input[0].to_i@land=[@size]x=1whilex 最佳答案 只需将数组映射为整数:@land边注如果你想得到一条线的平均值,你可以这样做:values=@input[x]

  7. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前,我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它,但这似乎不是“ruby方式”,我将需要在不久的将来访问更多模型。这可能会变得很脏,是否有针对这种情况的任何技术?注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展,本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向,这似乎很麻烦。最终从任何

  8. ruby-on-rails - 渲染另一个 Controller 的 View - 2

    我想要做的是有2个不同的Controller,client和test_client。客户端Controller已经构建,我想创建一个test_clientController,我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集,然后呈现客户端Controller的索引View,以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

  9. ruby-on-rails - 如何从 format.xml 中删除 <hash></hash> - 2

    我有一个对象has_many应呈现为xml的子对象。这不是问题。我的问题是我创建了一个Hash包含此数据,就像解析器需要它一样。但是rails自动将整个文件包含在.........我需要摆脱type="array"和我该如何处理?我没有在文档中找到任何内容。 最佳答案 我遇到了同样的问题;这是我的XML:我在用这个:entries.to_xml将散列数据转换为XML,但这会将条目的数据包装到中所以我修改了:entries.to_xml(root:"Contacts")但这仍然将转换后的XML包装在“联系人”中,将我的XML代码修改为

  10. ruby - 我可以使用 Ruby 从 CSV 中删除列吗? - 2

    查看Ruby的CSV库的文档,我非常确定这是可能且简单的。我只需要使用Ruby删除CSV文件的前三列,但我没有成功运行它。 最佳答案 csv_table=CSV.read(file_path_in,:headers=>true)csv_table.delete("header_name")csv_table.to_csv#=>ThenewCSVinstringformat检查CSV::Table文档:http://ruby-doc.org/stdlib-1.9.2/libdoc/csv/rdoc/CSV/Table.html

随机推荐