js 将数据中相同的元素合并
时间: 2025-07-05 09:01:57 浏览: 9
### JavaScript 中合并数组或其他数据结构中的重复元素
在 JavaScript 中处理数组或复杂数据结构时,可以通过多种方法来识别并合并其中的重复项。对于简单的数组而言,可以利用 `Set` 对象去除重复值;而对于更复杂的对象数组,则可能需要自定义逻辑来进行比较。
#### 使用 Set 去除简单类型的重复项
当面对的是由基本类型(如字符串、数字)组成的数组时,最简便的方式就是借助 ES6 的新特性——`Set` 来实现去重:
```javascript
const numbers = [1, 2, 3, 4, 5, 3, 2];
const uniqueNumbers = [...new Set(numbers)];
console.log(uniqueNumbers); // 输出: [1, 2, 3, 4, 5]
```
这种方法的时间复杂度接近于线性时间 O(n),因为内部操作主要依赖哈希表机制[^1]。
#### 合并与计数相同属性的对象
如果目标是一个包含多个具有特定键名的对象数组,并希望不仅移除完全相同的条目还统计其出现次数的话,那么就需要编写稍微复杂的函数了:
```javascript
function groupAndCountByProperty(arrayOfObjects, key) {
const result = arrayOfObjects.reduce((acc, obj) => {
acc[obj[key]] = (acc[obj[key]] || 0) + 1;
return acc;
}, {});
return Object.keys(result).map(keyValue => ({
[key]: keyValue,
count: result[keyValue],
}));
}
// 测试案例
const items = [
{ id: 'apple', name: 'Apple' },
{ id: 'banana', name: 'Banana' },
{ id: 'apple', name: 'Apple' }
];
console.log(groupAndCountByProperty(items, "id"));
/* 结果将是:
[
{"id": "apple", "count": 2},
{"id": "banana", "count": 1}
]
*/
```
这段代码通过遍历输入数组并将每个项目的指定字段作为索引来构建一个新的映射关系,在此过程中完成数量累加工作。最后再将这个映射转换回易于理解的形式返回给调用者。
#### 复杂情况下的深拷贝与对比
针对更加复杂的数据结构,比如嵌套多层的对象树形结构,通常会涉及到深层次节点之间的差异检测以及更新策略的选择。Vue.js 的虚拟DOM算法提供了一个很好的例子:它采用了一种高效的diffing技术用于最小化实际DOM变动量,从而提高了渲染效率。
阅读全文
相关推荐


















