數組去重的六種方法

數組去重在面試和工做中都是比較容易見到的問題,這幾天在複習基礎知識的時候,也順便總結了一下常見的方法,和你們一塊兒分享。若是你們還有其餘什麼方法還請評論你們一塊兒討論。若是有什麼沒有表達正確的地方還請你們斧正。javascript

00一、使用雙重for循環

要比較數組中的每個值咱們均可以用雙重for循環來解決,好比冒泡排序。一樣也可使用雙重for循環來數組去重。java

function unique(arr) {
  for (let i = 0; i < arr.length; i++) {
    for (let j = i+1; j < arr.length; j++) {
      if (arr[i] == arr[j]) {
        arr.splice(j,1)
        j--
      }
    }
  }
  return arr
}
let arr = [1,1,'true','true', 'a', 'a',true,true,false,false, undefined,undefined, null,null, NaN, NaN,'NaN','NaN', 0, 0,{},{},[],[]];
console.log(unique(arr)) // [ 1, 'true', 'a', false, undefined, NaN, NaN, 'NaN', {}, {} ]
複製代碼

能夠看見NaN沒有被去除掉,兩個{}都沒去掉,由於{}是引用值,而卻咱們使用的是arr[i] == arr[j]會發生類型轉換,因此如下都爲true面試

  • 1 == true
  • false== []
  • undefined == null
  • false == 0

要解決以上問題咱們可使用Object.is(arr[i], arr[j])的方法替換arr[i]==arr[j]既能夠去除NaN還能夠防止發生類型轉換。代碼這裏接不貼出了,你們能夠本身寫一下運行一下。數組

注:爲了方便如下arr都使用該處的arr值數據結構

2、利用indexOf()

使用indexOf(),能夠判斷一個數組中是否包含某個值,若是存在則返回該元素在數組中的位置,若是不存在則返回-1函數

functon unique(arr) {
    let res = []
  	for (let i = 0; i < arr.length; i++) {
        if (res.indexOf(arr[i]) === -1) {
          	res.push(arr[i])
        }
  	}
  	return res
}
console.log(unique(arr)) //[ 1,   'true',   'a',   true,   false,   undefined,   null,   NaN,   NaN,   'NaN',   0,   {},   {}, [], []]
複製代碼

這裏咱們新建一個數組來保存去重後的數組,若是該數組不包含元素就將該元素push到該數組中,能夠發現這種方法任然沒有去掉NaN、{}、[]ui

3、利用includes()

使用includes()方法也能夠判斷數組是否包含某個特定的元素,若是包含就返回true不包含就返回false。這和indexOf()方法有些相似,因此咱們使用includes()進行數組去重和indexOf()的方法原理是同樣的。this

functon unique(arr) {
    let res = []
    for (let i = 0; i < arr.length; i++) {
        if (!res.includes(arr[i])) {
      	    res.push(arr[i])
        }
    }
    return res
}
複製代碼

4、利用filter()

filter() 方法建立一個新的數組,新數組中的元素是經過檢查指定數組中符合條件的全部元素。而且filter()不會改變數組,也不會對空數組進行檢測filter()方法接收一個回調函數。spa

語法:

array.filter(function(item,index,arr), thisValue) 複製代碼
參數 描述
item 必須。當前元素的值
index 可選。當前元素的索引值
arr 可選。當前元素屬於的數組對象

代碼實現

function unique(arr) {
    return arr.filter((item,index, arr) => {
        return arr.indexOf(item) === index
    })
}
console.log(unique(arr)) //[ 1, 'true', 'a', true, false, undefined, null, 'NaN', 0, {}, {}, [], [] ]
複製代碼

這裏咱們用判斷indexOf(item)判斷當前元素的索引是否等於當前index,若是相等就返回該元素。code

5、使用對象的特色

對象是一種以鍵值對存儲信息的結構,而且不能有重複的鍵。

function unique(arr) {
  let obj = {}
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] in obj) {
      obj[arr[i]] ++
    } else {
      obj[arr[i]] = 10
    }
  }
  return Object.keys(obj) // 以數組的形式返回鍵
}
console.log(unique(arr)) // [ '0',   '1',   'true',   'a',   'false',   'undefined',   'null',   'NaN',   '[object Object]',   '']
複製代碼

這種方法的寫出來有點問題,由於是用Object.keys(obj)來返回鍵的集合因此獲得的都是字符串的形式。

6、使用set

ES6 提供了新的數據結構 Set。它相似於數組,可是成員的值都是惟一的,沒有重複的值。

function unique(arr) {
  return [...new Set(arr)]
}
console.log(unique(arr)) //[ 1,   'true',   'a',   true,   false,   undefined,   null,   NaN,   'NaN',   0,   {},   {},   [],   [] ]
複製代碼

這是ES6最經常使用的方法,獲得的效果也還不錯。

7、reduce大法

function unique(arr) {
    return arr.reduce((pre, cur) => {
        !pre.includes(cur) && pre.push(cur)
        return pre
    }, [])
}
複製代碼
謝謝你的閱讀。 但願你們也能夠把本身經常使用的方法分享一塊兒交流。
相關文章
相關標籤/搜索