JavaScript&ES6----数组去重的四种方法

方法一 --- 双层for循环

利用双层for循环,前一个循环前一项,后一个循环后一项,两两比对,如果发现重复的就用splice()属性,把重复的元素从数组arr中删除

let arr = [2,5,1,5,3,2,'hello','1',4]

let unique = (arr) =>{
    // 第一层for循环   循环数组前一项
    for(i = 0;i < arr.length;i++){
        //第二层for循环   循环数组后一项
        for(j = i+1;j < arr.length;j++){
            if(arr[i] === arr[j]){
           //splice(index,howmany)  j是索引值  1是要删除的个数
                arr.splice(j,1);
                //每删除一个元素,数组长度相应减一
                j--;
            }
        } 
    }
    return arr
}

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

方法二 ---- indexOf

要先声明一个新数组,利用indexOf,找到重复的元素则返回索引值,找不到返回-1,并push进新数组里

let arr = [2,5,1,5,3,2,'hello','1',4]
let unique1 = (arr) =>{
    // 声明一个新数组
    let newArr = [];
    for(i = 0;i< arr.length;i++){
  //等于-1则表示新数组里不存在该元素 符合条件 将该元素放入新数组 
     if(newArr.indexOf(arr[i]) === -1){
            newArr.push(arr[i])
        }
    }
    return newArr
}
console.log(unique1(arr));  //[ 2, 5, 1, 3, 'hello', '1', 4 ]

方法三 ---- includes

利用ES6中的includes属性

在ES6中,Array.prototype.includes();
includes是否包含某个元素,返回true/false

// 数组去重  第三种方法
let arr = [2,5,1,5,3,2,'hello','1',4]
let unique2 = (arr) =>{
    // 声明一个新数组
    let newArr = [];
    for(i = 0;i< arr.length;i++){
 //如果新数组newArr不包含该元素,则符合条件 放入新数组   
    if(!newArr.includes(arr[i])){
            newArr.push(arr[i])
        }
    }
    return newArr
}
console.log(unique2(arr));  //[ 2, 5, 1, 3, 'hello', '1', 4 ]

方法四 ----- Set()

在ES6中,Set类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构展。Set 构造函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化

// 数组去重的第四种方法 
let set = new Set(arr)
let [...a] = set   //数组解构的方法
console.log(set);  //Set(7) { 2, 5, 1, 3, 'hello', '1', 4 }
console.log(a);  //[ 2, 5, 1, 3, 'hello', '1', 4 ]

JavaScript&ES6----数组去重的四种方法_第1张图片

你可能感兴趣的:(JavaScript&ES6----数组去重的四种方法)