最全面的数组去重详细解析
Posted sugartang
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了最全面的数组去重详细解析相关的知识，希望对你有一定的参考价值。
最全哦
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> // 方案一：ES6 set去重,無法去掉{}對象,但是可以去掉NaN,甚至可以篩選出來null; function unique1(arr){ return Array.from(new Set(arr)) }; var arr1 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; console.log(‘第一種ES6 set去重,無法去掉{}對象‘) console.log(unique1( arr1)); //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}] // 這種方法無法去掉{}對象。 // 方案二： for套for然後splice去重,NaN和{}没有去重，true和null還有0直接消失了; let arr2 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique2(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, 1); j--; }; }; }; return arr; }; console.log(‘第2種 for套for然後splice去重,NaN和{}没有去重，true和null直接消失了‘); console.log(unique2(arr2)); // 第三種：利用indexOf去重,去掉null,動不了NaN; let arr3 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique3(arr) { if (!Array.isArray(arr)) { return console.log(‘type error‘); }; 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種利用indexOf去重NaN、{}没有去重‘); console.log(unique3(arr3)); // 第四種：sort(),NaN、{}没有去重; let arr4 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique4(arr) { if (!Array.isArray(arr)) { return console.log(‘type error!‘) } arr = arr.sort(); var array = [arr[0]]; for (var i = 1; i < arr.length; i++) { if (arr[i] !== arr[i - 1]) { array.push(arr[i]); } } return array; } console.log(‘第4種sort() NaN、{}没有去重‘); console.log(unique4(arr4)); // 第五種：利用includes {}没有去重 let arr5 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique5(arr) { if(!Array.isArray(arr)){ return console.log(‘type error!‘); } var array = []; for( var i =0; i< arr.length; i++ ){// includes 檢測數組是否有某個值 if( !array.includes(arr[i])){ array.push(arr[i]); } } return array; } console.log(‘第5種利用includes {}没有去重‘); console.log(unique5(arr5)); // 第六種：利用hasOwnproperty完美去重 let arr6 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique6(arr){ var obj = {}; return arr.filter(function(item, index, arr){ return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true) }) } console.log(‘第六種利用hasOwnproperty完美去重‘); console.log(unique6(arr6)); // 第七種：利用filter let arr7 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique7(arr){ return arr.filter((item, index, arr)=>{ return arr.indexOf(item, 0) === index; }) } console.log(‘第7種利用filter {}没有去重，去掉了NaN‘); console.log(unique7(arr7)); // 第八種：利用遞歸 NaN、{}没有去重 let arr8 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique8(arr){ var array = arr; var len = arr.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(‘第8種利用遞歸 NaN、{}没有去重‘); console.log(unique8(arr8)); // 第九種：利用Map結構{}没有去重 let arr9 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique9(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(‘第9種 利用Map結構{}没有去重‘); console.log(unique9(arr9)); // 第十種：利用reduce + includes,我表示看不懂 let arr10 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; function unique10(arr){ return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur] ,[]); } console.log(‘第10種 利用reduce + includes{}没有去重‘); console.log(unique10(arr10)); // 第十一種：利用[...new Set(arr)] let arr11 = [1,1,‘true‘,‘true‘,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN‘, 0, 0, ‘a‘, ‘a‘,{},{}]; let unique11 = [...new Set(arr11)]; console.log(‘第10種 利用[...new Set(arr)] {}没有去重‘); console.log(unique11); </script> </body> </html>
以上是关于最全面的数组去重详细解析的主要内容，如果未能解决你的问题，请参考以下文章