javascript数组怎么去重

javascript数组去重的核心答案是：1. 使用set可高效去重基本类型，但无法处理对象引用；2. indexof/includes适合小数组但性能差；3. map性能优于indexof，适合大数据量；4. 对象数组需基于唯一键或自定义比较规则去重；5. nan在set中被视为相同，而indexof无法识别；6. null和undefined可正常去重；7. 多属性或深比较需构造唯一标识或使用深比较逻辑；选择方法应综合考虑数据类型、性能需求和数组规模。

JavaScript数组去重，简单来说，就是把数组里重复的元素都干掉，只留下独一份。方法挺多的，各有优劣，选择哪个取决于你的具体需求，比如性能要求、数据类型等等。

解决方案

1. 利用Set数据结构

Set是ES6引入的新数据结构，它最大的特点就是不允许重复的值。所以，我们可以先把数组转成Set，然后再把Set转回数组。

立即学习“Java免费学习笔记（深入）”；

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = [...new Set(arr)]; // 或者 Array.from(new Set(arr))
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法简洁高效，尤其适合处理基本数据类型的数组。但需要注意的是，Set认为

NaN

2. 使用indexOf或includes

遍历数组，如果当前元素不在新数组中，就把它push进去。

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (uniqueArr.indexOf(arr[i]) === -1) { // 或者 !uniqueArr.includes(arr[i])
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法兼容性好，但性能相对较差，特别是对于大型数组。

indexOf

includes

3. 使用filter和indexOf

结合

filter

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.filter((item, index) => {
  return arr.indexOf(item) === index;
});
console.log(uniqueArr); // [1, 2, 3, 4, 5]

这种方法本质上还是基于

indexOf

4. 使用Map数据结构

Map对象保存键值对，任何值(对象或者原始值) 都可以作为一个键或一个值。我们可以利用Map的键的唯一性来实现去重。

const arr = [1, 2, 2, 3, 4, 4, 5];
const map = new Map();
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (!map.has(arr[i])) {
    map.set(arr[i], true);
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4, 5]

Map的

has

indexOf

5. 针对对象数组的去重

如果数组中的元素是对象，那么简单的

Set

indexOf

const arr = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'a'}];

function uniqueObjectArray(arr, key) {
  const seen = new Set();
  return arr.filter(item => {
    const k = item[key];
    return seen.has(k) ? false : seen.add(k);
  });
}

const uniqueArr = uniqueObjectArray(arr, 'id');
console.log(uniqueArr); // [{id: 1, name: 'a'}, {id: 2, name: 'b'}]

这个例子中，我们根据对象的

id

JavaScript数组去重有哪些性能优化的技巧？

阿里云-虚拟数字人

阿里云-虚拟数字人是什么？ ...

2

查看详情

1. 避免重复遍历： 尽量减少循环次数。例如，使用

   Set

   登录后复制
   或

   Map

   登录后复制
   可以在一次遍历中完成去重。

2. 选择合适的数据结构：

   Set

   登录后复制
   和

   Map

   登录后复制
   的查找效率比

   indexOf

   登录后复制
   高，适合处理大型数组。

3. 避免不必要的类型转换： 如果数组元素类型已知，避免在比较过程中进行类型转换，可以提高性能。

4. 利用缓存： 对于复杂的比较逻辑，可以利用缓存来避免重复计算。

5. 考虑数组规模： 对于小型数组，简单的

   indexOf

   登录后复制
   可能足够快。对于大型数组，更高效的算法更重要。

如何处理包含

null

undefined

NaN

1. null

   登录后复制
   和

   undefined

   登录后复制
   ： 可以直接使用

   Set

   登录后复制
   或

   indexOf

   登录后复制
   进行去重。它们会被视为普通的值。

2. NaN

   登录后复制
   ：

   NaN

   登录后复制
   与任何值都不相等，包括它自身。

   indexOf

   登录后复制
   无法找到

   NaN

   登录后复制
   。

   Set

   登录后复制
   认为

   NaN

   登录后复制
   是相等的，只会保留一个。如果需要区分多个

   NaN

   登录后复制
   ，需要自定义比较逻辑。

3. 混合类型： 如果数组包含多种类型的值，需要注意类型转换问题。可以使用

   typeof

   登录后复制
   运算符来判断类型，并进行相应的处理。

对象数组去重时，如何定义比较规则？

1. 单属性比较： 如果只需要根据一个属性来判断对象是否重复，可以直接比较该属性的值。

2. 多属性比较： 如果需要根据多个属性来判断，可以将这些属性的值组合成一个字符串或对象，然后进行比较。

3. 自定义比较函数： 可以编写自定义的比较函数，根据复杂的业务逻辑来判断对象是否重复。

4. 考虑深比较： 如果对象包含嵌套的对象或数组，需要进行深比较，确保所有属性都相同才认为对象重复。可以使用递归或第三方库来实现深比较。

以上就是javascript数组怎么去重的详细内容，更多请关注php中文网其它相关文章！