今天来聊一聊JS数组去重的一些方法,包括一些网上看到的和自己总结的,总共5种方法(ES5)。

第一种:遍历数组法

这种方法最简单最直观,也最容易理解,代码如下:

  var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
var newArr = []
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i])
}
}
console.log(newArr) // 结果:[2, 8, 5, 0, 6, 7]

这种方法很好理解,利用了indexOf()方法(indexOf()方法如果查询到则返回查询到的第一个结果在数组中的索引,如果查询不到则返回-1)。先创建一个新的空数组用来存储新的去重的数组,然后遍历arr数组,在遍历过程中,分别判断newArr数组里面是不是有遍历到的arr中的元素,如果没有,直接添加进newArr中,如果已经有了(重复),那么不操作,那么从头到尾遍历一遍,正好达到了去重的目的。

第二种:数组下标判断法

这种方法也比较好理解,代码如下:

 var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
var newArr = []
for (var i = 0; i < arr.length; i++) {
if (arr.indexOf(arr[i]) === i) {
newArr.push(arr[i])
}
}
console.log(newArr) // 结果:[2, 8, 5, 0, 6, 7]

这和第一种方法有重叠,不说多余的,直接看if这里,在遍历arr的过程中,如果在arr数组里面找当前的值,返回的索引等于当前的循环里面的i的话,那么证明这个值是第一次出现,所以推入到新数组里面,如果后面又遍历到了一个出现过的值,那也不会返回它的索引,indexof()方法只返回找到的第一个值的索引,所以重复的都会被pass掉,只出现一次的值都被存入新数组中,也达到了去重的目的。

第三种:排序后相邻去除法

这种方法用到了sort()方法,代码如下:

 var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
arr.sort()
var newArr = [arr[0]]
for (var i = 1; i < arr.length; i++) {
if (arr[i] !== newArr[newArr.length - 1]) {
newArr.push(arr[i])
}
}
console.log(newArr) // 结果:[0, 2, 5, 6, 7, 8]

这种方法的思路是:先用sort()方法把arr排序,那么排完序后,相同的一定是挨在一起的,把它去掉就好了,首先给新数组初始化一个arr[0],因为我们要用它和arr数组进行比较,所以,for循环里面i也是从1开始了,我们让遍历到的arr中的值和新数组最后一位进行比较,如果相等,则pass掉,不相等的,push进来,因为数组重新排序了,重复的都挨在一起,那么这就保证了重复的这几个值只有第一个会被push进来,其余的都和新数组的被push进来的这个元素相等,会被pass掉,也达到了去重的效果。

第四种:优化的遍历数组法

  var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2, 8]
var newArr = []
for (var i = 0; i < arr.length; i++) {
for (var j = i + 1; j < arr.length; j++) {
if (arr[i] === arr[j]) {
i++
j = i
}
}
newArr.push(arr[i])
}
console.log(newArr) // 结果:[0, 5, 6, 7, 2, 8]

思路:两层for循环,外面一层是控制遍历到的前一个arr中的元素,里面一层控制的是第一层访问到的元素后面的元素,不断的从第0个开始,让第0个和他后面的元素比较,如果没有和这个元素相等的,则证明没有重复,推入到新数组中存储起来,如果有和这个元素相等的,则pass掉它,直接进入下一次循环。从第1个开始,继续和它后面的元素进行比较,同上进行,一直循环到最后就是:不重复的都被推入新数组里面了,而重复的前面的元素被pass掉了,只留下了最后面的一个元素,这个时候也就不重复了,则推入新数组,过滤掉了所有重复的元素,达到了去重的目的。

第五种:数组遍历法

 var arr = ['a', 'a', 'b', 'c', 'b', 'd', 'e', 'a']
var newArr = []
for (var i = 0; i < arr.length; i++) {
var bl = true
for (var j = 0; j < newArr.length; j++) {
if (arr[i] === newArr[j]) {
bl = false
break
}
}
if (bl) {
newArr.push(arr[i])
}
}
console.log(newArr) // 结果:["a", "b", "c", "d", "e"]
思路:也是两层for循环,外层for循环控制的是arr数组的遍历,内层for循环控制的是新数组的遍历,从第0位开始,如果新数组中没有这个arr数组中遍历到的这个元素,那么状态变量bl的值还是true,那么自然进入到了if中把这个值推入到新数组中,如果有这个元素,那么代表重复,则把状态变量bl取值改为false,并且跳出当前循环,不会进入到if内部,而进入下一次外层开始的循环。这样循环往复,最后也达到了去重的效果。

js数组去重五种方法的更多相关文章

  1. js数组去重(多种方法)

    // js数组去重 Array.prototype.fun1 = function(){ var arr = this, result = [], i, len = arr.length; for(i ...

  2. js 数组去重(7种)

    第一次写技术博客,之前总是认为写这些会很浪费时间,还不如多看几篇技术博文.但...但昨天不知道受了什么刺激,好像有什么在驱使着自己要写一样,所以才有了今天的第一篇博文.总觉得应该要坚持这样写下去.初次 ...

  3. JS数组去重的十种方法

    一.前言: 我们在实际工作中,或者在面试找工作时,都会用到或者被问到一个问题,那就是"数组如何去重".是的,这个问题有很多种解决方案,看看下面的十种方式吧! 二.数组去重方式大汇总 ...

  4. (PASS)JAVA数组去重 三种方法 (不用集合)

    第一种方法(只学到数组的看): 定义一个新的数组长度和旧数组的长度一样,存储除去重复数据的旧数组的数据和0, package demo01; import java.sql.Array; import ...

  5. java script 数组去重两种方法

    第一种方法: var arr=[1,1,2,3,4,4,4,5,6,6,6,6];    var arrb=Array();    for(var i=0;i<arr.length;i++)   ...

  6. JavaScript数组去重(5种方法)

    // 数组去重 let arr = ['a', 'b', 'b', 1, 1, 'true', true, true, NaN, NaN, 'NaN', undefined, undefined, n ...

  7. js数组去重几种思路

    在一些后台语言中都内置了一些方法来处理数组或集合中重复的数据.但是js中并没有类似的方法,网上已经有一些方法,但是不够详细.部分代码来源于网络.个人总计如下:大致有4种思路 1)使用两次循环比较原始的 ...

  8. js数组去重的hash方法

    对于 JavaScript 数组去除重复项,现在有多种方法,其中一种是hash,如下: if (!Array.prototype.unique) { Array.prototype.unique = ...

  9. JS数组去重的十种方法(转载)

    重点:博客原文出自http://www.cnblogs.com/yuanbo88/p/7345331.html.我只是想给自己做个笔记.感谢敲代码的怪蜀黍做的贡献. Methods 1: 思路:定义一 ...

随机推荐

  1. python+requests实现接口测试 - get与post请求使用(转载)

    转自:http://www.cnblogs.com/nizhihong/p/6567928.html 简介:Requests 是用Python语言编写,基于 urllib,采用 Apache2 Lic ...

  2. jmeter数据库查询与接口返回进行对比

    今天在群里又看到了一个小伙伴问类似的问题,[jmeter如何实现数据库查询出来的结果与接口返回的结果进行对比判断,或者数据库两字段的相加减与接口返回进行对比].其实都一样,因为你把运算放在查询那里就行 ...

  3. day58

    JQ高级 一.选择器 1.css语法匹配 标签 | 类 | id | 交集 群组 | 后代 | 兄弟 伪类 | 属性 2.索引匹配 :eq(index) | :gt(index) | :lt(inde ...

  4. 【转】PHP 类与对象

    原文:http://blog.csdn.net/e421083458/article/details/8217650 1.类与对象 对象:实际存在该类事物中每个实物的个体.$a =new User() ...

  5. Docker一键部署Hadoop心得(一)

    最近一直在折腾使用docker一键部署全分布式hadoop集群,虽然一键部署的脚本写好了并且可以成功运行出各个节点,但在运行一个wordcount实例时出现了错误,错误如下: java.io.IOEx ...

  6. day 11 前方高能-迭代器

    第一类对象 -----函数名  == 变量名 函数对象可以像变量一样进行赋值 还可以作为列表的元素进行使用 可以作为返回值返回 def wrapper():     def inner():      ...

  7. 大数据入门第二十二天——spark(二)RDD算子(2)与spark其它特性

    一.JdbcRDD与关系型数据库交互 虽然略显鸡肋,但这里还是记录一下(点开JdbcRDD可以看到限制比较死,基本是鸡肋.但好在我们可以通过自定义的JdbcRDD来帮助我们完成与关系型数据库的交互.这 ...

  8. 20155226《网络攻防》 Exp3 免杀原理与实践

    20155226<网络攻防> Exp3 免杀原理与实践 实验过程 1. msfvenom直接生成meterpreter可执行文件 直接将上周做实验时用msf生成的后门文件放在virscan ...

  9. WPF编程,通过Path类型制作沿路径运动的动画一种方法。

    原文:WPF编程,通过Path类型制作沿路径运动的动画一种方法. 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_43307934/article/de ...

  10. 总结 : C#事件理解

    要理解事件,首先必须理解委托!! 1.如果说委托是一个类型,那么事件就是一个对象! 2.事件的创建必须是借助某个委托类型来完成的! 3.也就是说,委托是事件的类型,事件本身是个对象!! 4.所以,事件 ...