广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JS数组去重的常用4种方法
  • 222
分享到

JS数组去重的常用4种方法

2024-04-02 19:04:59 222人浏览 独家记忆
摘要

1.es6的Set类数组去重 var arr = [1,2,2,3,3,4,4,1,5,6,6,5] function unique (arr) { return Array.f

1.es6的Set类数组去重

var arr = [1,2,2,3,3,4,4,1,5,6,6,5]
function unique (arr) {
  return Array.from(new Set(arr))
}

console.log(unique(arr))
 //[1,2,3,4,5,6]

ES6的Set是类数组,里面的值是唯一的,但是不是真正的数组所以要通过Array.from()方法转化为数组,不考虑兼容问题是最简单的去重方法

2.for循环嵌套for循环

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];

function unique(arr) {
    for (var i = 0; i < arr.length; i++) {    // 首次遍历数组
        for (var j = i + 1; j < arr.length; j++) {   // 再次遍历数组
            if (arr[i] == arr[j]) {          // 判断连个值是否相等
                arr.splice(j, 1);           // 相等删除后者
                j--;
            }
        }
    }
    return arr
}
console.log(unique(arr));

两个for循环加上spliceES5常用的方法
第一个for遍历每个数组项,第二个for循环遍历第一个for循环当前遍历项后面的数组项与第一个for当前数组项作比较,后面存在相等的项,则删除掉此项,并且j要减一,因为删除了一项,所以后面的元素往前移了,所以减一来抵消迁移确保每一项遍历完

3.indexOf去重

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];
function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('错误!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {    // 首次遍历数组
        if (array.indexOf(arr[i]) === -1) {   // 判断索引有没有等于
            array.push(arr[i])
        }
    }
    return array
}
console.log(unique(arr));

indexOf()会判断数组里面是否含有这个值,没有则返回-1,有则返回存在的数组下标值,有多个只返回第一个,不再继续判断
for循环加indexOf,for循环存在newArr里则什么都不做,不存在则加入新数组里,返回新数组

4.利用filter

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];
function unique(arr) {
    return arr.filter( (item, index, arr) => {
        //当前元素,在原始数组中的第一个索引==当前索引值,否则返回当前元素
        return arr.indexOf(item) === index;
    });
}
console.log(unique(arr));

filter加indexOf,判断当前的索引值等不等于indexOf返回的索引值,等于就是同一个数组项,不等于的情况就是当前的item是第二次出现,而indexOf判断出来的下标值还是第一个,这一项则不会返回,所以达到了去重的要求

更多关于JS数组去重的方法请查看下面的相关链接

--结束END--

本文标题: JS数组去重的常用4种方法

本文链接: https://www.lsjlt.com/news/145047.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • JS数组去重的常用4种方法
    1.ES6的Set类数组去重 var arr = [1,2,2,3,3,4,4,1,5,6,6,5] function unique (arr) { return Array.f...
    99+
    2022-11-13
  • js数组去重的11种方法
    在实际工作或面试中,我们经常会遇到“数组去重”问题,接下来就是使用js实现的数组去重的多种方法: 1.将数组的每一个元素依次与其他元素做比较,发现重复元素,删除 var arr ...
    99+
    2022-11-12
  • js数组去重常见的方法汇总(7种)
    目录1、借助ES6提供的Set结构 new Set() 简单好用 强烈推荐2、利用 filter() 去重3、利用for 循环 搭配 indexOf 去重4、将数组的每一个元素依次与...
    99+
    2022-11-13
  • 非常全面的12种js数组去重的方法
    目录前言方法1、双重for循环方法2、for循环 +findIndex方法3、sort 排序方法4、Set方法5、set + Array.from方法6、filter + index...
    99+
    2022-11-13
  • JS数组去重常用方法有哪些
    这篇文章主要介绍了JS数组去重常用方法有哪些,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体如下:先对浏览器Array对象进行支持inde...
    99+
    2022-10-19
  • js六种数组去重的方法是什么
    这篇文章主要介绍了js六种数组去重的方法是什么的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇js六种数组去重的方法是什么文章都会有所收获,下面我们一起来看看吧。 第一种 ne...
    99+
    2022-10-19
  • JS实现数组去重的11种方法总结
    目录1.ES5常用:利用for嵌套for,然后splice去重2.ES6常用:Set去重3.indexOf去重4.sort()排序5.对象属性不能相同(不建议)6.includes(...
    99+
    2022-11-13
  • sql去重 ,4种查询数量方法
    标题第一种 :distinct select count (distinct 订单号) from dual 标题第二种:查询去重 group by select count(订单号...
    99+
    2023-09-11
    sql 数据库 mysql
  • 七种JS实现数组去重的方式
    目录1.利用Set()+Array.from() 2.利用两层循环+数组的splice方法 3.利用数组的indexOf方法 4.利用数组的includes方法 5.利用数组的fil...
    99+
    2022-11-12
  • JavaScript中数组去重常用的五种方法详解
    目录1.对象属性(indexof)2.new Set(数组)3.new Map()4.filter() + indexof5.reduce() + includes补充原数组 con...
    99+
    2022-11-13
  • JavaScript常用数组去重方法
    本篇内容主要讲解“JavaScript常用数组去重方法”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript常用数组去重方法”吧!数组去重,一般都是在面试的时候才会碰到,一般是要求手...
    99+
    2023-06-20
  • JS数组去重的九种高阶方法(亲测有效)
    前言 一般的方法此处也不列举了,还是有很多的,如双层循环判断是否相等,或新建数组比较再push等等,需要注意的是,使用splice方法移除元素时,有可能会导致数组塌陷问题,需要处理一...
    99+
    2022-11-12
  • js数组去重的方法有哪些
    js数组去重的方法有使用Set、使用indexOf、使用includes、使用filter和使用reduce。1、使用Set,特点是集合中的元素不会重复;2、使用indexOf,可以返回指定元素在数组中的第一个索引位置;3、使用includ...
    99+
    2023-08-09
  • JS对象数组去重的3种方法示例及对比
    目录一.去重前后数据对比二.使用方法1.使用filter和Map2.使用reduce3.使用for循环三.2400条数据,三种方法处理时间对比总结一.去重前后数据对比 // 原数...
    99+
    2022-11-12
  • JS常用的4种截取字符串方法
    目录JS常用的4种截取字符串方法补充:js中常遇到 切割截取字符串的几种方法切割截取字符串的几种方法JS常用的4种截取字符串方法 平常经常把这几个api的参数记混了,于是打算记录下来...
    99+
    2023-02-05
    js截取字符串方法 js字符串截取 js切割字符串
  • js对象合并的4种方式与数组合并的4种方式
    目录一、对象合并1、拓展运算符(...)2、Object.assign()3、递归赋值4、jquery中的extend()二、数组合并1、扩展操作符2、使用array.conca&#...
    99+
    2022-11-13
    js对象合并 js数组合并 对象与数组合并
  • js中如何使用reduce()方法数组去重
    小编给大家分享一下js中如何使用reduce()方法数组去重,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!JavaScript的特点1.JavaScript主要用来向HTML页面添加交互行为。2.JavaScript可以直...
    99+
    2023-06-14
  • JavaScript实现数组去重的7种方法
    目录前言方法实现双循环去重indexOf方法去重1indexOf方法去重2相邻元素去重利用对象属性去重set与解构赋值去重Array.from与set去重总结前言 去重是开发中经常会...
    99+
    2022-11-13
  • Javascript数组去重的几种方法详解
    目录数组去重1 双层for循环(类似冒泡排序的双层循环写法)2 循环和indexof、循环和includes3 利用对象属性不能重复去重4 ES6 Set5 ES6 Array. p...
    99+
    2022-11-12
  • JavaScript数组去重的几种方法详谈
    目录一、Set去重二、双重for循环去重三、利用indexOf去重四、利用icludes去重五、filter六、Map总结一、Set去重 function funSet(arr...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作