四. JavaScript 數組去重

雙重循環

　　數組去重，不就是比較數組元素，去掉重複出現的麼。最原始的方式不正是雙重循環進行比較處理嘛

//測試數據
var test = [1,2,2,10,'1','a','a','b','@','@'];
 
console.log(unique1(test));  //[1,2,10,'1','a','b','@']
 
function unique1(target) {   //雙層循環比較數組元素進行去重
  var res = [];      //存放數據
  for(var i = 0 ; i<target.length ; i++){
 
    for(var j = 0,resLen = res.length ; j < resLen ; j++){
      if(target[i] === res[j]){  //若是有相同的數據，則break
        break;
      }
    }
 
    if(j === resLen){   //res中沒有相同的數據，則存放
      res.push(target[i])
    }
  }
  return res;
}

indexof優化內層循環

　　在本慄中使用indexof優化內層循環。indexOf()方法返回在數組中能夠找到一個給定元素的第一個索引，若是不存在，則返回-1

var test = [1,2,2,10,'1','a','a','b','@','@'];
 
console.log(unique2(test));  //[1,2,10,'1','a','b','@']
 
function unique2(target) {   //indexof簡化內層循環
  var res = [];      //存放數據
  for(var i = 0 ; i<target.length ; i++){
    if(res.indexOf(target[i]) < 0)  //若是res中不存在該元素，返回-1
    res.push(target[i])
  }
  return res;
}

對象鍵值對優化內層循環

　　對象的鍵不一樣重複，這個特性能夠用來判斷重複元素

　　//測試數據
    var test = [1,2,2,10,'1','a','a','b','@','@'];

    console.log(unique3(test));  //[1,2,10,'a','b','@']   由於對象鍵是字符串 因此此種方式會認爲 1 和 '1' 是相同的

    function unique3(target) {  //對象鍵值的方式
      var obj = {};
      var res = target.filter(function(value,index){
        return obj.hasOwnProperty(typeof value + value ) ? false : (obj[typeof value + value] = true);

 }) return res; }

filter優化外層循環

　　在本慄中使用filter優化外層循環。filter() 方法建立一個新數組, 其包含經過所提供函數實現的測試的全部元素。

var test = [1,2,2,10,'1','a','a','b','@','@'];
 
console.log(unique5(test));  //[1,2,10,'1','a','b','@']
 
function unique5(target) {   //filter簡化外層循環
  var res = target.filter(function(value,index,array){
    return target.indexOf(value) === index    //第一次出現則返回true
  })
  return res
}

Set去重

　　ES6 提供了新的數據結構 Set。它相似於數組，可是成員的值都是惟一的，沒有重複的值。這種特性用來數組去重，十分的方便。

　　//測試數據
    var test = [1,2,2,10,'1','a','a','b','@','@'];

    var unique6 = (target) => [...new Set(target)];  //乾脆利落

    console.log(unique6(test));  //[1,2,10,'1','a','b','@']