数组对象,名字相同的对象进行合并

这篇具有很好参考价值的文章主要介绍了数组对象,名字相同的对象进行合并。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

需求: 数组对象,name字段相同的进行合并,并将每条数据中的num累加,金额为合并之后的num*price

原始数据tableData

<el-table
	  :data="tableData"
	  style="width: 100%; margin-bottom: 20px"
	  border
	>
		<el-table-column prop="date" label="日期"></el-table-column>
		<el-table-column prop="num" label="数量"></el-table-column>
		<el-table-column prop="name" label="名称"></el-table-column>
		<el-table-column prop="price" label="单价"></el-table-column>
	</el-table>
	const tableData = reactive([
		{ date: '2023-10-13',num: 30,name: '零食',price: 20, },
		{ date: '2023-12-23',num: 15,name: '干果',price: 56 },
		{ date: '2023-5-16',num: 50,name: '零食',price: 20 },
		{ date: '2023-8-21',num: 22,name: '干果',price: 56 },
		{ date: '2023-8-21',num: 22,name: '货物',price: 26 },
		{ date: '2023-9-12',num: 10,name: '衣服',price: 26 },
	])

现在需要将数据合并为以下展示形式:日期进行合并为多个数据合并之前的日期区间

<el-table
	  :data="newData"
	  style="width: 100%; margin-bottom: 20px"
	  border
	>
		<el-table-column prop="date" label="日期"></el-table-column>
		<el-table-column prop="num" label="数量"></el-table-column>
		<el-table-column prop="name" label="名称"></el-table-column>
		<el-table-column prop="amount" label="金额"></el-table-column>
	</el-table>

js处理逻辑:

const newData = ref([])
	const getData = ()=>{
		let temp = {}
		let start_date = ''
		let end_date = ''
		for(var i=0;i<tableData.length;i++){
			let item = tableData[i]
			let {name,date,price,num} = item
			if(temp[name] == null){
				temp[name] = JSON.parse(JSON.stringify(item))
				temp[name]['amount'] = num * price
				start_date = date.replace(/-/g, '')
				end_date = date.replace(/-/g, '')
			}else{
				item = JSON.parse(JSON.stringify(item))
				temp[name]['num'] += num
				temp[name]['amount'] += num * price
				end_date = date.replace(/-/g, '')
			}
			let dateRage = [start_date,end_date]
			const newDateRange = dateRage.filter((item)=>item != '')
			newDateRange.sort((a,b)=>{
				return new Date(a) - new Date(b)
			})
			temp[name]['date'] = newDateRange[0] + '-' + newDateRange[newDateRange.length - 1]
		}
		let newArr = []
		Object.keys(temp).forEach(item=>{
			newArr.push(temp[item])
		})
		newData.value = newArr
		
	}

需要注意:temp[name] = JSON.parse(JSON.stringify(item))需要使用深copy,要不会导致合并之后的数据值不对文章来源地址https://www.toymoban.com/news/detail-824271.html

到了这里,关于数组对象,名字相同的对象进行合并的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • js 对象合并 与数组合并

    在 JavaScript 中,对象和数组都是非常常见的数据结构,它们可以用来存储和操作数据。有时候我们需要将两个对象或数组合并在一起,以便更好地进行操作。本文将会介绍如何在 JavaScript 中合并对象和数组。 合并对象 在 JavaScript 中,可以使用 Object.assign() 方法将两个或多个对

    2024年02月06日
    浏览(56)
  • 使用Lambda表达式对List<Map<String,Object>>中key值相同的Map进行分组合并

    现有两张表A表和B表,A表存放的是各省市的认证次数,B表存放的是各省市的申领次数,重点关注dq,cs这两个字段,其他的字段可忽略                                                      A表(省市认证次数表)                                                 B表

    2024年02月13日
    浏览(62)
  • excel中如果A列中某项有多条记录,针对A列中相同的项,将B列值进行相加合并统计

    excel中如果A列中某项有多条记录,针对A列中相同的项,将B列值进行相加合并统计。注意:B列的数据类型要为数字 如: 实现方法: C1、D1中分别输入公式,然后下拉 效果如下:

    2024年02月11日
    浏览(55)
  • 检查Javascript对象数组中是否存在对象值,如果没有向数组添加新对象

    需求: 如果我有以下对象数组: 有没有办法循环遍历数组,以检查特定的用户名值是否已经存在,如果它什么都不做,但是如果它没有用所述用户名(和新的ID)将新对象添加到数组? 解决 方法 一: 我假设id s在这里是独一无二的。 some是检查数组中事物存在的一个很好的函数

    2024年02月11日
    浏览(43)
  • 【华为OD机试 2023】 数组合并(C++ Java JavaScript Python)

    华为OD统一考试A卷+B卷 新题库说明 2023年5月份,华为官方已经将的 2022/0223Q(1/2/3/4)统一修改为OD统一考试(A卷)和OD统一考试(B卷)。 你收到的链接上面会标注A卷还是B卷。请注意:根据反馈,目前大部分收到的都是B卷。但是仍有概率抽到A卷。 A卷对应2023的新题库(2022Q4 2

    2023年04月12日
    浏览(40)
  • 4 JavaScript数组和对象

    4 数组和对象 在JS中创建数组非常简单. 直接[ ]即可. 也可以用正规军的new Array(). 不过效果都是一样的. 数组的常用操作: 在JS中创建一个对象非常容易. 和python中的字典几乎一样{ }: 使用对象 从上述内容中几乎可以看到. JS对象的使用几乎是没有门槛的. 十分灵活 代码的效果图如

    2024年02月12日
    浏览(35)
  • JavaScript如何从数组(数组对象)中删除特定数据

    如果数组中有重复的两个元素,我们只想删除一个元素,我们必须使用另一种方法。

    2024年02月12日
    浏览(73)
  • javascript二维数组(20)JSON对象

    在JavaScript中,JSON对象是一种数据格式,用于存储和传输数据。JSON,全称JavaScript Object Notation,是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。 JSON对象由键值对组成,其中键是字符串,值可以是字符串、数字、布尔值、null、数组或另一个J

    2024年02月07日
    浏览(48)
  • JavaScript:js数组/对象遍历方法

    一、js遍历方法 序号 方法 描述 1 for 使用最基本的for循环可以遍历数组 2 for of for...of语句用来遍历可迭代对象(包括数组、Set、Map、字符串等),它可以替代传统的for循环和forEach()方法。for...of循环每次迭代都将返回一个值,而不是索引。 3 for in for...in语句用来遍历对象的可

    2024年02月09日
    浏览(56)
  • 如何在 JavaScript 中将数组转为对象

    首先,我们需要明白对象具有键和值。 如果我们想把某个东西转换成一个 对象 ,我们需要传递具有这两个要求的东西:键和值。 满足这些要求的参数有两种类型: 具有嵌套键值对的数组 Map 对象 这是一个带有键值对的嵌套数组 当我们应用它时,我们可以使用 Object.fromEnt

    2024年02月01日
    浏览(56)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包