js数组对象去重,如果数组对象值重复存在时,需改变该数组对象值
时间: 2024-06-15 12:04:58 浏览: 155
在JavaScript中,可以使用多种方法对数组对象进行去重。一种常见的方法是使用Set数据结构,因为Set只会存储唯一的值。以下是一种基于Set的数组对象去重方法:
```javascript
// 假设存在一个包含重复值的数组对象
let arr = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 1, name: 'Alice' },
{ id: 3, name: 'Charlie' }
];
// 使用Set进行去重
let uniqueArr = Array.from(new Set(arr.map(JSON.stringify)), JSON.parse);
// 修改重复值的数组对象
uniqueArr.forEach((obj, index) => {
if (index !== arr.findIndex(item => item.id === obj.id)) {
obj.name += ` (${index + 1})`;
}
});
console.log(uniqueArr);
```
上述代码中,首先使用`map`方法将数组对象转换为字符串形式,然后使用Set去除重复的字符串,再通过`Array.from`方法将字符串转换回数组对象形式。最后,使用`forEach`方法遍历去重后的数组对象,如果某个对象在原数组中有多个重复出现,则修改其name属性以表示其重复次数。
相关问题
js数组对象去重
可以使用 ES6 的 Set 数据结构来实现数组对象去重,具体代码如下:
```
let arr = [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}, {id: 1, name: 'Alice'}];
let set = new Set(arr.map(JSON.stringify));
let uniqueArr = Array.from(set).map(JSON.parse);
console.log(uniqueArr);
```
首先将数组对象转换为字符串形式,然后使用 Set 数据结构去重,最后再将去重后的字符串数组转换为原始的对象数组即可。
js 数组对象去重
### JavaScript 中数组对象去重的方法
在 JavaScript 中,对于数组对象的去重操作有多种实现方式。以下是几种常见的方法:
#### 方法一:使用 `reduce` 和辅助对象
通过 `reduce` 方法可以遍历整个数组并构建一个新的无重复项的结果集。此过程中可以通过一个临时对象来记录已经存在的键值。
```javascript
let newObj = {};
const repeatData = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 1, name: 'Alice' }
];
repeatData = repeatData.reduce((preVal, curVal) => {
newObj[curVal.id] ? '' : newObj[curVal.id] = true && preVal.push(curVal);
return preVal;
}, []);
console.log(repeatData, 'repeatData');
```
这种方法的核心在于利用了一个外部的对象 `newObj` 来存储已处理过的唯一标识符(如 `id`),从而避免重复数据被加入最终结果集中[^1]。
---
#### 方法二:基于 ES6 的 `Set` 结构与自定义逻辑
虽然原生的 `Set` 只能用于简单类型的去重,但对于复杂对象也可以借助其特性配合其他手段完成目标。
```javascript
const arr = [
{ name: 'zhangsan', age: 12 },
{ name: 'lisi', age: 14 },
{ name: 'zhangsan', age: 12 },
{ name: 'lisi', age: 14 },
{ name: 'zhangsan', age: 12 }
];
function uniqueByProperty(array, propertyKey) {
const seen = new Set();
return array.filter(item => {
const value = item[propertyKey];
if (seen.has(value)) {
return false;
} else {
seen.add(value);
return true;
}
});
}
const result = uniqueByProperty(arr, 'name');
console.log(result);
```
这里我们创建了一个名为 `uniqueByProperty` 的通用工具函数,它接受两个参数——待过滤的数组以及作为区分依据的关键字段名称。内部则运用到了集合类型 `Set` 来追踪哪些属性已经被遇到过[^2]。
---
#### 方法三:Map 数据结构的应用
另一种优雅的方式是采用 `Map` 这种高效的数据容器来进行快速查表式的判定工作。
```javascript
/**
* @description: 对象数组去重
* @param arr 要去重的数组
* @param key 根据某一个属性去重
* @return 去重后的数组
*/
function removeSame(arr, prop) {
let map = new Map(); // 创建新的映射实例
for (let item of arr) {
!map.has(item[prop]) && map.set(item[prop], item); // 如果当前prop对应的值未存在,则存入
}
return [...map.values()]; // 将所有value取出形成新数组返回
}
const data = [
{ id: 1, name: 'Tom' },
{ id: 2, name: 'Jerry' },
{ id: 1, name: 'Tom' }
];
console.log(removeSame(data, 'id'));
```
上述代码片段展示了如何定义一个专门用来解决此类问题的小型库函数 `removeSame()` ,该函数接收原始数组及其指定属性名作输入,并输出经过适当筛选后的新列表[^3]。
---
### 性能对比分析
每种方案都有各自的优缺点,在实际项目开发当中可以根据具体需求场景灵活选用最合适的那一种。比如当关注点放在执行效率上时可能更倾向于选择第三种;而如果追求简洁明了的话第二种也不失为一个好的选项。
---
阅读全文
相关推荐














