博客

现在es6逐渐成为了进入了前端开发的视野里，各大浏览器和流行的框架对es6的支持也非常好，之前看过几次阮一峰老师写的es6入门这本书，感觉非常不错，所以是时候再深入地去学习总结一下了。那么就先从set结构数组去重开始吧。

以前数组去重非常麻烦，我之前也总结过。那么就来总结一下数组去重有哪些方法吧。


1.使用set数据结构去重。（es6新方法）


先看一下set的定义：

***ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

Set 本身是一个构造函数，用来生成 Set 数据结构。

const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));
for (let i of s) {
  console.log(i);
}
// 2 3 5 4

封装一个数组去重函数（Array.from()转化数组的新方法）

function dedupe(array){
 return Array.from(new Set(array));
}
dedupe([1,1,2,3]) //[1,2,3]

扩展运算符(…)内部使用for…of循环

let arr = [1,2,3,3];
let resultarr = [...new Set(arr)]; 
console.log(resultarr); //[1,2,3]
// 这样也能封装成一个更简洁的数组去重方法  如下
let deletRepeat = (arr)=> [...new Set(arr)];
deleRepeat([1,2,3,4,5,6,6,5,4,3,2,1,6])   //  [1, 2, 3, 4, 5, 6]

2.利用indexOf以及forEach(利用下标去重法)

let arrResult = [];
arr.forEach(function(v,i,arr){
 let bool = arr.indexOf(v,i+1);
 // 也可以这样写，es6新出了一种校验数组是否包含一个成员的方法includes
 // 该方法的第二个参数表示搜索的起始位置，默认为0。如果第二个参数为负数，则表示倒   数的位置，如果这时它大于数组长度（比如第二个参数为-4，但数组长度为3），则会重置为从0开始。
 // let bool = arr.includes(v,i+1); i+1表示开始搜索的位置
 // if(!bool){
 //    arrResult.push(v);
 //}
 // es6的includes这个方法很不错，在大部分时候可以替代indexOf();
 if(bool==-1){
 arrResult.push(v);
}
});
console.log(arrResult);

还有好多种方法，以后会逐一添加…

3.利用es6新出的includes和forEach方法去重(和方法2类似)

function array(arr){
    let newarr = [];
    arr.forEach(function(currentIndex,i,array){  // 利用forEach
        if(!arr.includes(currentIndex,i+1)){  // 利用includes方法 记住i+1是重点，
        //  相当于是从当前元素之后开始检索有没有和当前元素一样的元素，如果没有就加到新数组里面，如果有就不添加
          newarr.push(currentIndex);
        }
    })
    return newarr; 
}

let arr2 = [1,2,3,4,1,3,5,6,4,3,2,1]

array(arr2)
//  (6) [5, 6, 4, 3, 2, 1]