今天博主跟大家聊一下__陣列去重__！！ 【基本最全，從原始到高階，再到一句話！~是不是感覺很厲害哈！】
廢話不多說咱們直接看程式碼！！
博主的審美不太好 湊合看哈！
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>陣列去重01</title>
</head>
<body>
<!--利用ES6 Set 去重··不考慮相容性-->
<script>
<!--=========================================-->
這裡是要進行去重的陣列：
var arr = [1,1,'true','true',true,true,12,12,false,false,undefined,undefined,null,null,NaN,NaN,'NaN',0,0,'a','a',{},{}];
// 1.不知道用了什麼特異功能
function unique(arr){
return Array.from(new Set(arr))
}
console.log("第1種");
console.log(unique(arr));
// 上述方法還無法去掉"{}"
// ================================================
//2.利用雙重迴圈
// 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,i);
// j--;
// }
// }
// }
// return arr;
// }
// console.log("第2種");
// console.log(unique(arr));
// 迴圈有毒謹慎開啟，小心死迴圈！！
//=================================================
//3. 新建一個空陣列，for迴圈進行判斷 陣列形同則跳過不同push進陣列
function unique(arr){
if(!Array.isArray(arr)){
console.log('type error!');
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("第3種");
console.log(unique(arr));
//=============================================================
//4.sort();----有錯
function unique(){
if(!Array.isArray(arr)){
console.log('type error!');
return;
}
arr = arr.sort();
var arrry = [];
for(var i=1;i<arr.length;i++){
if(arr[i] !==arr[i-1]){
arrry.push(arr[i]);
}
}
return arrry;
}
console.log("第4種");
console.log(unique(arr));
//利用sort（）根據排序的結果進行遍歷及相鄰元素比對
// ===================================================
//5.利用物件的屬性不能相同的特性
function unique() {
if (!Array.isArray(arr)) {
console.log('type error!');
return;
}
var arrry = [];
var obj = {};
for(var i=0;i<arr.length;i++){
if (!obj[arr[i]]){
arrry.push(arr[i]);
obj[arr[i]] = 1;
}else{
obj[arr[i]]++;
}
}
return arrry;
}
console.log("第5種");
console.log(unique(arr));
//=============================================
//6.利用Includes
function unique(arr) {
if (!Array.isArray(arr)) {
console.log('type error!');
return;
}
var array = [];
for(var i=0;i<arr.length;i++){
if (!array.includes(arr[i])) {
array.push(arr[i]);
}
}
return array;
}
console.log("第6種");
console.log(unique(arr));
//=============================================
//7.利用hasOwnProperty 判斷是否存在物件屬性
function unique(arr){
var obj = {};
return arr.filter(function(item,index,arr){
return obj.hasOwnProperty(typeof item + item) ? false:(obj[typeof item + item] = true)
})
}
console.log("第7種");
console.log(unique(arr));
//================================================
//8.利用filter
function unique(arr){
return arr.filter(function(item,index,arr){
return arr.indexOf(item,0) ===index;
});
}
console.log("第8種");
console.log(unique(arr));
//================================================
//9.利用遞迴去重
function unique(arr){
var array = arr;
var len = array.length;
array.sort(function(a,b){
return a-b;
});
function loop(index){
if(index >= 1){
if(array[index] === array[index-1]){
array.splice(index,1);
}
loop(index-1);//遞迴陣列去重
}
}
loop(len-1);
return array;
}
console.log("第9種");
console.log(unique(arr));
//===================================================
//10.利用Map資料結構
function unique(arr){
let map = new Map();
let array = new Array();
for (let i=0;i<arr.length;i++){
if(map.has(arr[i])){
map.set(arr[i],true);
}else{
map.set(arr[i],false);
array.push(arr[i]);
}
}
return array;
}
console.log("第10種");
console.log(unique(arr));
//====================================================
//11.利用reduce+includes
function unique(arr){
return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[])
}
console.log("第11種");
console.log(unique(arr));
//===================================================
//12.[...new Set(arr)]
console.log("第12種");
console.log([...new Set(arr)]);
//程式碼就是這麼少就是這麼狂！，（其實嚴格來說並不是一種）
</script>
</body>
</html>
哈哈，是不是感覺很神奇！
[...new Set([1, "1", -1, 1,2,3,4,5, 1, 3])]
(7) [1, "1", -1, 2, 3, 4, 5]
Set是ES6提供的新的資料結構，類似於陣列，但是值都是唯一的，不會有重複的值；
Set本身是一個建構函式，用來生成Set資料結構，接下來給大家分享哈 Set的幾個方法：
var s = new Set();
s.add(11);
s.add('height');
s.add(11);
console.log(s) 結果：{11, "height"}
因為Set值得唯一性，多次新增某個值，如果有相同值會自動過濾
s.add({});
s.add({});
向 Set 加入值的時候，不會發生型別轉換，所以 5 和“5”是兩個不同的值。Set 內部判斷兩個值是否不同，使用的演算法類似於精確相等運算子（===），這意味著，兩個物件總是不相等的。唯一的例外是 NaN 等於自身（精確相等運算子認為 NaN 不等於自身）。所以上面加入的兩個空物件並不是精確相等，所以被視為不同元素；
s.delete(11)； //刪除某個值
console.log(s) 結果：{"height"}
console.log(s.has(11)) // false
//返回一個布林值，表示引數是否為Set的成員；
s.clear()； //清除所有值；
console.log(s) 結果：{}
var items = new Set([1,2,3,4,5,5,5,5]);
items.size //5
Set函式可以接收一個數組作為引數用來初始化
Array.from可以將set結構轉為陣列；
var items = new Set([1, 2, 3, 4, 5]);
var array = Array.from(items);
console.log(array) // (5) [1, 2, 3, 4, 5]
這樣就可以實現陣列去重的方法：
function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1,1,2,3]) // [1, 2, 3]
那麼一開始的程式碼在這就可以給大家解惑
由於擴充套件運算子（...）內部使用 for...of 迴圈，完全可以用於 Set 結構。
var arr = [3, 5, 2, 2, 5, 5];
var arr1 = [...new Set(arr)];
console.log(arr1) // (3) [3, 5, 2]