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

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数组去重的方法请查看下面的相关链接

赞 (0)

相关推荐

  • js实现数组去重、判断数组以及对象中的内容是否相同

    复制代码 代码如下: /* *数组元素去重 */ if(typeof Array.prototype.distinct != "function"){ Array.prototype.distinct = function(){ this.sort(); for(var i=0;i<this.length-1;i++){ if($.isPlainObject(this[i]) && $.isPlainObject(this[i+1])){ if(o2o(this[

  • JS实现的字符串数组去重功能小结

    JS实现的字符串数组去重功能小结

    本文实例讲述了JS实现的字符串数组去重功能.分享给大家供大家参考,具体如下: 这里只考虑最简单字符串的数组去重,暂不考虑,对象,函数,NaN等情况,这种用正则实现起来就吃力不讨好了. 非正则实现:ES6实现 <script> let str_arr=["b","c",1,"a", 3,"v", "2","e", "6","g", &qu

  • js数组去重的5种算法实现

    1.遍历数组法 最简单的去重方法,实现思路:新建一新数组,遍历传入数组,值不在新数组就加入该新数组中:注意点:判断值是否在数组的方法"indexOf"是ECMAScript5 方法,IE8以下不支持,需多写一些兼容低版本浏览器代码,源码如下: // 最简单数组去重法 function unique1(array){ var n = []; //一个新的临时数组 //遍历当前数组 for(var i = 0; i < array.length; i++){ //如果当前数组的第i已

  • 两个数组去重的JS代码

    第一种: 复制代码 代码如下: function unique (arr){  var obj = {},newArr = [];  for(var i = 0;i < arr.length;i++){    var value = arr[i];    if(!obj[value]){      obj[value] = 1;      newArr.push(value);    }  }  return newArr;} 这个方法把数组的值存入对象,所以,在数组存在对象队员的时候,运行失败

  • JS实现数组去重及数组内对象去重功能示例

    JS实现数组去重及数组内对象去重功能示例

    本文实例讲述了JS实现数组去重及数组内对象去重功能.分享给大家供大家参考,具体如下: 大家在写项目的时候一定遇到过这种逻辑需求,就是给一个数组进行去重处理,还有一种就是给数组内的对象根据某一个属性,比如id,进行去重,下面我写了两个函数,都是可以达到这个效果的,一个是纯ES5的去重办法,一个是用了ES6的 Array.from(new Set())和ES5的reduce来进行去重 我先定义两个数组吧 var arr = [1,2,3,5,3,4,5,6,6,"test","t

  • 史上最全JavaScript数组去重的十种方法（推荐）

    一.前言: 我们在实际工作中,或者在面试找工作时,都会用到或者被问到一个问题,那就是"数组如何去重".是的,这个问题有很多种解决方案,看看下面的十种方式吧! 二.数组去重方式大汇总: Methods 1: 思路:定义一个新数组,并存放原数组的第一个元素,然后将元素组一一和新数组的元素对比,若不同则存放在新数组中. function unique(arr){ var res = [arr[0]]; for(var i=1; i<arr.length; i++){ var repea

  • JavaScript数组去重的两种方法推荐

    1.数组去重: Array类型并没有提供去重复的方法,如果要把数组的重复元素干掉,那得自己想办法: 方法一:利用indexOf方法: var aa=[1,3,5,4,3,3,1,4] function arr(arr) { var result=[] for(var i=0; i<arr.length; i++){ if(result.indexOf(arr[i])==-1){ result.push(arr[i]) } } console.log(result) } arr(aa) 方法二:

  • 关于js数组去重的问题小结

    1.根据js对象中key不重复的原则,构思出数组去重的方法,按照最常规的思维如下: 复制代码 代码如下: function distinctArray(arr){var obj={},temp=[];for(var i=0;i<arr.length;i++){if(!obj[arr[i]]){temp.push(arr[i]);obj[arr[i]] =true;}}return temp;   }   var testarr=[1,2,3,2];   console.log(distinctA

  • JavaScript数组去重的五种方法

    javascript数组去重是一个比较常见的需求,解决方法也有很多种,网上都可以找到答案的,下面小编给大家整理了一份关于同类型的数组去重的方法,先给大家介绍下简单实现思路. 思路: 遍历数组,一一比较,比较到相同的就删除后面的 遍历数组,一一比较,比较到相同的,跳过前面重复的,不相同的放入新数组 任取一个数组元素放入新数组,遍历剩下的数组元素任取一个,与新数组的元素一一比较,如果有不同的,放入新数组. 遍历数组,取一个元素,作为对象的属性,判断属性是否存在 1. 删除后面重复的: functio

  • JS实现数组去重方法总结(六种方法)

    方法一: 双层循环,外层循环元素,内层循环时比较值 如果有相同的值则跳过,不相同则push进数组 Array.prototype.distinct = function(){ var arr = this, result = [], i, j, len = arr.length; for(i = 0; i < len; i++){ for(j = i + 1; j < len; j++){ if(arr[i] === arr[j]){ j = ++i; } } result.push(arr[

  • js算法中的排序、数组去重详细概述

    其实在js中实现数组排序,采用数组中sort方法实现还是比较简单的: 一.排序 简单实现数组排序 复制代码 代码如下: var arr = [];  for(var i=0;i<20;i++){      arr.push(Math.floor(Math.random()*100))  }  arr.sort(function(a,b){      return a>b?1:-1;  })  alert(arr) 不能简单使用sort方法,默认情况下 sort方法是按ascii字母顺序排序的,

  • JS实现数组去重,显示重复元素及个数的方法示例

    JS实现数组去重,显示重复元素及个数的方法示例

    本文实例讲述了JS实现数组去重,显示重复元素及个数的方法.分享给大家供大家参考,具体如下: <script> var arr = ['土豆','土豆','茄子','土豆','茄子','土豆','紫红色']; function qc(arr){ var resultObj = {}; var result = []; var result2 = []; for(var i=0; i<arr.length; i++){ if(result.indexOf(arr[i]) == -1){ re

  • JS实现的合并多个数组去重算法示例

    JS实现的合并多个数组去重算法示例

    本文实例讲述了JS实现的合并多个数组去重算法.分享给大家供大家参考,具体如下: var arr1 = ['a','b']; var arr2 = ['a','c','d']; var arr3 = [1,'d',undefined,true,null]; //合并两个数组,去重 var concat_ = function(arr1,arr2){ //不要直接使用var arr = arr1,这样arr只是arr1的一个引用,两者的修改会互相影响 var arr = arr1.concat();

  • js数组去重的三种常用方法总结

    第一种是比较常规的方法 思路: 1.构建一个新的数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与结果数组对比 3.若结果数组中没有该元素,则存到结果数组中 复制代码 代码如下: Array.prototype.unique1 = function(){ var res = [this[0]]; for(var i = 1; i < this.length; i++){  var repeat = false;  for(var j = 0; j < res.lengt

  • JS实现的JSON数组去重算法示例

    本文实例讲述了JS实现的JSON数组去重算法.分享给大家供大家参考,具体如下: 需求描述:去除JSON数组中paymode字段相同的项,并将paymoney累加. paylist:[{paymode:'1',payname:"现金",paymoney:"20"}, {paymode:'2',payname:"支付宝",paymoney:"50"},{paymode:'1',payname:"现金",paym

  • js数组去重的方法总结

    js数组去重的方法总结

    一.普通的方法去重 1.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 */ function uniq(array){ var temp = []; //一个新的临时数组 for(var i = 0; i < array.length; i++){ if(temp.indexOf(array[i]) == -1){ temp.push(array[i]); } } return te

  • JS实现字符串去重及数组去重的方法示例

    JS实现字符串去重及数组去重的方法示例

    本文实例讲述了JS实现字符串去重及数组去重的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net js数组.字符串去重</title> </head> <body> <script type="text/j

  • 高性能js数组去重(12种方法，史上最全)

    数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码.如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看. 在真实的项目中碰到的数组去重,一般都是后台去处理,很少让前端处理数组去重.虽然日常项目用到的概率比较低,但还是需要了解一下,以防面试的时候可能回被问到. 注:写的匆忙,加上这几天有点忙,还没有非常认真核对过,不过思路是没有问题,可能一些小细节出错而已. 数组去重的方法 一.利用ES6 Set去重(ES6中最常用) function u

随机推荐