前端数组去重的方法集合 包含es6

https://blog.youkuaiyun.com/bixiaoxiao41521/article/details/80285044

 

1. 双循环去重

原理： 定义一个包含原始数组第一个元素的数组，然后遍历原始数组，对原始数组进行遍历，将原始数组中的每一个元素与新数组中的每一个元素进行对比，如果不重复就添加到新数组里，最后返回新数组。这种方式很耗费时间喝内存，不适合大型数组。

1.  

2. // 双重循环去重，原理： 先定义一个包含原始数组的第一个元素的新数组，记住这里是新数组，然后进行两次循环，把新数组和原始数组进行对比，为啥要进行两次循环呢，写着写着的时候，你发现，你如果只循环一次呢，你没办法对比两个数组哇。

3. function unrepeat(arr) {

4. // body...

5. if (!Array.isArray(arr)) {

6. console.log('type err');

7. return;

8. }

9. let newArr = [arr[0]];

10. for (let i = 1; i< arr.length; i++) {

11. let flag = true;

12. // 这是你循环的第一次，你在这里能够拿到传入的数组的每一个值。接下来你要做的就是把这个循环的每一个值和另一个循环的每一个值进行对比，执行的顺序是，第一个循环先给你一个饼，然后你去第二个里拿出来每一个，对比这些里面和第一个有没有不同的地方。第二个对比完，在抛给你一个，依次类推。

13. for(let j = 0; j<newarr.length; j="" ++)="" {="" 这里是对你要存的不重复的数组元素数组的循环="" ，为啥里面要有一个了呢，那是因为啊，它是老大哇，就算有重复也是后面的问题。="" if(arr[i]="==newArr[j])" flag="false;" break;="" }="" if="" (flag)="" newarr.push(arr[i])="" return="" newarr;="" <="" code="" style="-webkit-print-color-adjust: exact;">

#### let 和var 的区别： 1.作用域不同，let 和cost 都是块级作用域，而var是全局作用域。 #### 2.使用let 定义的是常量，在同一作用域，再次赋值，就会报错。使用var 的情况下，后执行的会替换掉先执行的。 #### 3.声明一个变量，但是未赋值的情况下，输出都是undefined，但是使用let声明但是没有赋值的，就会报错，而使用var的只是输出了undefined，let 相对于var 有着更严格的语法检查。 ### 2. indexOf 方法去重1

数组的indexof方法可以返回某个指定的元素在数组中首次出现的位置，该方法首先丁酉一个空数组，然后调用indexof 对原数组进行遍历判断，如果元素不在res中，则将其push放进去，最后将新数组返回

1.  

2. function unquite (arr) {

3. if(!Array.isArray(arr)) {

4. console.log('type err')

5. }

6. let newArr = [];

7. for (let i = 0; i< arr.length; i++) {

8. if(newArr.indexOf(arr[i]) ===-1)) {

9. newArr.push(arr[i])

10. }

11. }

12. return newArr;

13. }

### 3.indexOf 之2

利用indexOf检测元素在数组中第一次出现的位置是否和元素现在的位置相等，如果不等则说明该元素是重复元素

1.  

2. function unique (arr) {

3. if (!Array.isArray(arr)) {

4. console.log('type error');

5. return;

6. }

7. return Array.prototype.filter.call(arr,function(item,index){

8. return arr.indexOf(item) === index;

9. })

10. }

4. 相邻元素去重

这种方法首先调用了数组的排序方法，sort（） ，然后根据排序后的结果进行遍历及相邻元素进行比对，如果相等则跳过改元素，直到遍历结束。

1.  

2. function unquire (arr){

3. if(!Array.isARRAY(arr)) {

4. console.log("type err")

5. }

6. arr = arr.sort()

7. let res = [arr[0]]

8. for（let i = 1; i<arr.length; i++）{="" if(arr[i]="" !="=arr[i-1])" {="" }="" <="" code="" style="-webkit-print-color-adjust: exact;">

 

5. 利用对象属性去重

创建空对象，遍历数组，将数组中的值设为对象的属性，并给该属性赋初始值为1，每出现一次，对应的属性值增加1，这样，属性对应的就是该元素出现的次数了

1.  

2. function unquite (arr) {

3. if(!Array.isArray(arr)) {

4. console.log('tyoe err')

5. return;

6. }

7. let res = [],

8. obj = {};

9. for(let i = 0; i<arr.length; i++)="" {="" if(!obj[arr[i]]){="" res.push(arr[i])="" obj[arr[i]]="1" }="" else="" ++="" return="" res;="" <="" code="" style="-webkit-print-color-adjust: exact;">

6.set 与解构赋值去重

es6中新增了数据类型set，set的一个最大的特点就是数据不重复。set函数可以接受一个数组作为参数来初始化，利用该特性也能做到数组去重。

1.  

2. function unique (arr){

3. if(!Array.isArray(arr)) {

4. console.log('type error');

5. return;

6. }

7. return [...new Set(arr)]

8. }

 

7. Array.form 与set 去重

Array.form 方法可以将结构转换为数组结果，而我们知道set结果是不重复的数据集，因此能够达到去重的目的

1.  

2. function unique (arr){

3. if (!Array.isArray(arr)) {

4. console.log('type error!')

5. return

6. }

7. return Array.form(new Set(arr))

8. }