📌  相关文章
📜  从数组 javascript 中删除重复对象(1)

📅  最后修改于: 2023-12-03 15:06:35.796000             🧑  作者: Mango

从数组 JavaScript 中删除重复对象

在 JavaScript 中,我们经常需要从数组中删除重复的对象。这是一个常见的问题,因为数组中的重复对象可能会导致错误或干扰我们的程序逻辑。

下面将介绍两种方法来删除 JavaScript 数组中的重复对象。

方法一:使用 Set 类型

Set 类型是 ECMAScript 6 中新增的数据结构,可以用于存储一组唯一的值。我们可以将数组中的每个对象放到一个 Set 类型中,这样就会自动去重。

代码片段如下:

const arr = [{id: 1}, {id: 2}, {id: 3}, {id: 2}];
const set = new Set(arr.map(item => JSON.stringify(item)));
const uniqueArr = Array.from(set).map(item => JSON.parse(item));
console.log(uniqueArr); // [{id: 1}, {id: 2}, {id: 3}]

上面的代码先将每个对象转换为字符串,然后将这些字符串放入 Set 类型中去重。最后,将去重后的字符串再转换为 对象组成的数组。

方法二:使用 reduce 方法

JavaScript 数组中的 reduce 方法可以用来遍历数组并返回一个新的值。我们可以调用 reduce 方法并使用一个空数组作为初始值,然后利用 reduce 方法的回调函数来去重。

代码片段如下:

const arr = [{id: 1}, {id: 2}, {id: 3}, {id: 2}];
const uniqueArr = arr.reduce((result, item) => {
  const ids = result.map(item => item.id);
  if(ids.indexOf(item.id) === -1){
    result.push(item);
  }
  return result;
}, []);
console.log(uniqueArr); // [{id: 1}, {id: 2}, {id: 3}]

上面的代码中,我们使用 reduce 方法遍历数组。在回调函数中,我们首先获取已经去重的对象的 id 属性组成的数组 ids,然后检查当前对象的 id 是否已经在数组中出现过。如果没有出现过,则将这个对象加入到 result 数组中返回。最后,reduce 方法会返回一个新的去重的数组。

总结

通过 Set 类型或 reduce 方法,我们可以轻松地删除 JavaScript 数组中的重复对象。选择哪一种方法取决于你的具体需求。在处理大型数组时,Set 类型的效率可能会更高一些。如果你想兼容更多的浏览器,则建议使用 reduce 方法。