JavaScript中的数组去重的常用方法

小王日记a

已于 2022-04-22 20:27:40 修改

阅读量643

点赞数

分类专栏：小王日记文章标签：前端 javascript

于 2022-04-10 14:56:00 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_46116626/article/details/124078311

版权

小王日记专栏收录该内容

11 篇文章

订阅专栏

本文介绍了JavaScript中去除数组重复元素的五种方法，包括使用ES6的Set、双层循环splice、indexOf、includes以及结合sort。这些方法适用于不同场景，帮助你实现数组元素唯一化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript中的数组去重

JavaScript中数组中可能存在多个重复的元素，但是我们想得到数组中每个元素都是唯一的值怎么办，那就先让我们先来简单了解一下吧！

1、ES6的Set去重

ES6中的Set相信我们大家都不陌生，他就是一个构造函数，类似于数组，但是成员值是唯一的，所以他是一个对于数组去重来说很好的方法。
多说一句Set中不存在重复元素的原因是：Set不存储value，因为key不重复，所以Set中没有重复的元素。

Array.from(new Set(arr));去重转化为数组输出

var arr = [1, 2, 2, 3, 3, 3, 4];
    var arr1 = Array.from(new Set(arr));
console.log(arr1);1,2,3,4

2、双层for循环用splice的方法进行删除

如果数组是乱序的，而你又不想排序，那就可以用这种方法，其实有点类似于冒泡排序（个人理解）。

var arr = [1, 2, 2, 3, 3, 3, 4];
    for (let i = 0; i < arr.length; i++) {
      for (let j = i + 1; j < arr.length; j++) {
        while (arr[i] == arr[j]) {
          arr.splice(j, 1);
        }
      }
    }
console.log(arr);

3、通过indexOf

借用新数组来存储去重后的元素

var arr = [1, 2, 2, 3, 3, 3, 4];
    var arr1 = [];
    for (let i = 0; i < arr.length; i++) {
      if (arr1.indexOf(arr[i]) == -1) {
        arr1.push(arr[i]);
      }
    }
console.log(arr1);1,2,3,4

4、通过includes

第三种和第四种相同，只是使用的检查数组中存不存在元素的方法不同

var arr = [1, 2, 5, 3, 2, 3, 4, 3, 4];
    var arr1 = [];
    for (let i = 0; i < arr.length; i++) {
      if (!arr1.includes(arr[i])) {
      ///通过includes判断新数组是否有这个元素如果没有就把他push进去
        arr1.push(arr[i]);
      }
    }
    console.log(arr1);

5、利用sort()借用新数组

先排序再进行相邻元素的比较，如果相邻元素不相等则把后面的元素加入

var arr = [1, 2, 5, 3, 2, 3, 4, 3, 4];
    arr.sort();
    console.log(arr);
    var arr1 = [arr[0]];///先把第一个加入数组
    for (let i = 1; i < arr.length; i++) {
      if (arr[i] != arr[i - 1]) {///因为是递增数组，判断后面的和前面加入的是不是相等决定是不是加入到数组
        arr1.push(arr[i]);
      }
    }
    console.log(arr1);