数组去重，简单来说就是一个数组中如果同时存在两个相同的值，但是我们只需要其中一个即可，不需要将两个相同的值都一起展示出来，这个时候就必须得使用到javascript的数组去重方法了，在javascript中并没有专门的方法直接去重的，因此我们得自己来写一个这样的方法。下面我仅介绍其中的容易理解的4种方法，当然还有其他更多的方法，希望大家能够自己去寻找和学习了，因为目前我就仅能理解这3种方法。
大概的思路应该是这样的：
1）、定义一个变量数组 res 保存结果，遍历需要去重的数组，如果该元素已经存在在 res 中了，则说明是重复的元素，如果没有，则放入 res 中。
2）、将原数组中重复元素的最后一个元素放入结果数组中
下面我们直接来看代码，代码可以让你一目了然。
万能的for循环
1 | var arr = [1,2,3,1,2,'1','3','3']; |
2 | function uniqueTwo(arr) { |
3 | var res = []; |
4 | for(var i=0; i < arr.length; i++){ |
5 | var item = arr[i] |
6 | res.indexOf(item)===-1 && res.push(item) |
7 | } |
8 | return res; |
9 | } |
10 | var testTwo = uniqueTwo(arr); |
11 | console.log('testTwo',testTwo); // 返回[1, 2, 3, "1", "3"] |
以上代码，我们可以分析得到，首先我们遍历整个数组，将得到的值通过indexOf（首次出现的位置）得到字符第一次出现的位置，如果没有出现过则会返回-1，那么说明数组中仅包含一个此类字符，接着将其push到一个新的数组中即可。
使用indexOf与filter（代码更加简洁）
filter() 方法是创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
filter使用方法 array.filter(function(currentValue,index,arr), thisValue)
currentValue 必须。当前元素的值
index 可选。当期元素的索引值
arr 可选。当期元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。如果省略了 thisValue ，”this” 的值为 “undefined”
1 | var arr = [1,2,3,1,2,'1','3','3']; |
2 | function uniqueThree(arr) { |
3 | return arr.filter(function (item, index, array) { |
4 | return array.indexOf(item) === index; |
5 | }) |
6 | } |
7 | var testThree = uniqueThree(arr); |
8 | console.log('testThree',testThree); //返回[1, 2, 3, "1", "3"] |
使用filter来创建一个新数组，并且此数组中使用indexOf来进行去重即可
先将数组进行排序后，在进行对比
1 | var b = [1,1,1,2,2,8,8,9,9,0,32,13,1,2,3,4,5,6,7,8,9,0]; |
2 | b.sort(); |
3 | var res = [] |
4 | for(var i=0;i<b.length;i++){ |
5 | if(b[i+1] != b[i]){ |
6 | res.push(b[i]) |
7 | } |
8 | } |
9 | console.log(res)//[0, 1, 13, 2, 3, 32, 4, 5, 6, 7, 8, 9] |
ES6中的强大方法
在ES6中，我们可以直接通过Array.from()方法创建一个新数组，Array.from()很像slice方法，但是我们还可以使用Set方法。直接看代码
1 | var arr = [1,2,3,1,2,'1','3','3']; |
2 | function unique(arr){ |
3 | return Array.from(new Set(arr)) |
4 | } |
5 | var test = unique(arr); |
6 | console.log(test); //返回[1, 2, 3, "1", "3"] |
甚至，外面可以将ES6直接简写成如下代码
1 | var arr = [1,2,3,1,2,'1','3','3']; |
2 | var unique = (arr)=>{ |
3 | [...new Set(arr)] |
4 | } |
是不是感觉ES6更加强大？什么，你还不会ES6？赶快加紧学习吧，再不学习新技术，你就落伍了！