JS數組去重的幾種方法

JS數組去重

今天來聊一聊JS數組去重的一些方法，我總結了6種方法，還有一點就是，我使用的JS編碼風格是JavaScript Standard風格，是不加分號的（避免給你們形成誤會）。

第一種：遍歷數組法

這種方法最簡單最直觀，也最容易理解，代碼以下：

var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
  var newArr = []
  for (var i = 0; i < arr.length; i++) {
    if (newArr.indexOf(arr[i]) === -1) {
      newArr.push(arr[i])
    }
  }
  console.log(newArr) // 結果：[2, 8, 5, 0, 6, 7]
複製代碼

這種方法很好理解，利用了indexOf()方法，indexOf()方法若是查詢到則返回查詢到的第一個結果在數組中的索引，若是查詢不到則返回-1。先建立一個新的空數組用來存儲新的去重的數組，而後遍歷arr數組，在遍歷過程當中，分別判斷newArr數組裏面是否是有遍歷到的arr中的元素，若是沒有，直接添加進newArr中，若是已經有了（重複），那麼不操做，那麼從頭至尾遍歷一遍，正好達到了去重的目的。

第二種：數組下標判斷法

這種方法也比較好理解，代碼以下：

var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
  var newArr = []
  for (var i = 0; i < arr.length; i++) {
    if (arr.indexOf(arr[i]) === i) {
      newArr.push(arr[i])
    }
  }
  console.log(newArr) // 結果：[2, 8, 5, 0, 6, 7]
複製代碼

這和第一種方法有重疊，不說多餘的，直接看if這裏，在遍歷arr的過程當中，若是在arr數組裏面找當前的值，返回的索引等於當前的循環裏面的i的話，那麼證實這個值是第一次出現，因此推入到新數組裏面，若是後面又遍歷到了一個出現過的值，那也不會返回它的索引，indexof()方法只返回找到的第一個值的索引，因此重複的都會被pass掉，只出現一次的值都被存入新數組中，也達到了去重的目的。

第三種：排序後相鄰去除法

這種方法用到了sort()方法，代碼以下：

var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2]
  arr.sort()
  var newArr = [arr[0]]
  for (var i = 1; i < arr.length; i++) {
    if (arr[i] !== newArr[newArr.length - 1]) {
      newArr.push(arr[i])
    }
  }
  console.log(newArr) // 結果：[0, 2, 5, 6, 7, 8]
複製代碼

這種方法的思路是：先用sort()方法把arr排序，那麼排完序後，相同的必定是挨在一塊兒的，把它去掉就行了，首先給新數組初始化一個arr[0]，由於咱們要用它和arr數組進行比較，因此，for循環裏面i也是從1開始了，咱們讓遍歷到的arr中的值和新數組最後一位進行比較，若是相等，則pass掉，不相等的，push進來，由於數組從新排序了，重複的都挨在一塊兒，那麼這就保證了重複的這幾個值只有第一個會被push進來，其他的都和新數組的被push進來的這個元素相等，會被pass掉，也達到了去重的效果。

第四種：優化的遍歷數組法

var arr = [2, 8, 5, 0, 5, 2, 6, 7, 2, 8]
  var newArr = []
  for (var i = 0; i < arr.length; i++) {
    for (var j = i + 1; j < arr.length; j++) {
      if (arr[i] === arr[j]) {
        i++
        j = i
      }
    }
    newArr.push(arr[i])
  }
  console.log(newArr) // 結果：[0, 5, 6, 7, 2, 8]
複製代碼

思路：兩層for循環，外面一層是控制遍歷到的前一個arr中的元素，裏面一層控制的是第一層訪問到的元素後面的元素，不斷的從第0個開始，讓第0個和他後面的元素比較，若是沒有和這個元素相等的，則證實沒有重複，推入到新數組中存儲起來，若是有和這個元素相等的，則pass掉它，直接進入下一次循環。從第1個開始，繼續和它後面的元素進行比較，同上進行，一直循環到最後就是：不重複的都被推入新數組裏面了，而重複的前面的元素被pass掉了，只留下了最後面的一個元素，這個時候也就不重複了，則推入新數組，過濾掉了全部重複的元素，達到了去重的目的。

第五種：數組遍歷法

var arr = ['a', 'a', 'b', 'c', 'b', 'd', 'e', 'a']
  var newArr = []
  for (var i = 0; i < arr.length; i++) {
    var bl = true
    for (var j = 0; j < newArr.length; j++) {
      if (arr[i] === newArr[j]) {
        bl = false
        break
      }
    }
    if (bl) {
      newArr.push(arr[i])
    }
  }
  console.log(newArr) // 結果：["a", "b", "c", "d", "e"]
複製代碼

思路：也是兩層for循環，外層for循環控制的是arr數組的遍歷，內層for循環控制的是新數組的遍歷，從第0位開始，若是新數組中沒有這個arr數組中遍歷到的這個元素，那麼狀態變量bl的值仍是true，那麼天然進入到了if中把這個值推入到新數組中，若是有這個元素，那麼表明重複，則把狀態變量bl取值改成false，而且跳出當前循環，不會進入到if內部，而進入下一次外層開始的循環。這樣循環往復，最後也達到了去重的效果。

第六種（ES6）

let arr = ['a', 'a', 'b', 'c', 'b', 'd', 'e', 'a']
let newArr = Array.from(new Set(arr))
console.log(newArr) // 結果：["a", "b", "c", "d", "e"] 
複製代碼