JS數(shù)組去重的常用4種方法
1.ES6的Set類數(shù)組去重
var arr = [1,2,2,3,3,4,4,1,5,6,6,5] function unique (arr) { return Array.from(new Set(arr)) } console.log(unique(arr)) //[1,2,3,4,5,6]
ES6的Set是類數(shù)組,里面的值是唯一的,但是不是真正的數(shù)組所以要通過Array.from()方法轉(zhuǎn)化為數(shù)組,不考慮兼容問題是最簡單的去重方法
2.for循環(huán)嵌套for循環(huán)
var arr = [1,2,2,3,3,4,4,1,5,6,6,5]; function unique(arr) { for (var i = 0; i < arr.length; i++) { // 首次遍歷數(shù)組 for (var j = i + 1; j < arr.length; j++) { // 再次遍歷數(shù)組 if (arr[i] == arr[j]) { // 判斷連個值是否相等 arr.splice(j, 1); // 相等刪除后者 j--; } } } return arr } console.log(unique(arr));
兩個for循環(huán)加上spliceES5常用的方法
第一個for遍歷每個數(shù)組項(xiàng),第二個for循環(huán)遍歷第一個for循環(huán)當(dāng)前遍歷項(xiàng)后面的數(shù)組項(xiàng)與第一個for當(dāng)前數(shù)組項(xiàng)作比較,后面存在相等的項(xiàng),則刪除掉此項(xiàng),并且j要減一,因?yàn)閯h除了一項(xiàng),所以后面的元素往前移了,所以減一來抵消遷移確保每一項(xiàng)遍歷完
3.indexOf去重
var arr = [1,2,2,3,3,4,4,1,5,6,6,5]; function unique(arr) { if (!Array.isArray(arr)) { console.log('錯誤!') return } var array = []; for (var i = 0; i < arr.length; i++) { // 首次遍歷數(shù)組 if (array.indexOf(arr[i]) === -1) { // 判斷索引有沒有等于 array.push(arr[i]) } } return array } console.log(unique(arr));
indexOf()會判斷數(shù)組里面是否含有這個值,沒有則返回-1,有則返回存在的數(shù)組下標(biāo)值,有多個只返回第一個,不再繼續(xù)判斷
for循環(huán)加indexOf,for循環(huán)存在newArr里則什么都不做,不存在則加入新數(shù)組里,返回新數(shù)組
4.利用filter
var arr = [1,2,2,3,3,4,4,1,5,6,6,5]; function unique(arr) { return arr.filter( (item, index, arr) => { //當(dāng)前元素,在原始數(shù)組中的第一個索引==當(dāng)前索引值,否則返回當(dāng)前元素 return arr.indexOf(item) === index; }); } console.log(unique(arr));
filter加indexOf,判斷當(dāng)前的索引值等不等于indexOf返回的索引值,等于就是同一個數(shù)組項(xiàng),不等于的情況就是當(dāng)前的item是第二次出現(xiàn),而indexOf判斷出來的下標(biāo)值還是第一個,這一項(xiàng)則不會返回,所以達(dá)到了去重的要求
更多關(guān)于JS數(shù)組去重的方法請查看下面的相關(guān)鏈接
相關(guān)文章
深入認(rèn)識javascript中的eval函數(shù)
發(fā)現(xiàn)為本文起一個合適的標(biāo)題還不是那么容易,呵呵,所以在此先說明下本文的兩個目的.2009-11-11JS實(shí)現(xiàn)超級好看的鼠標(biāo)小尾巴特效
這篇文章主要給大家介紹了關(guān)于JS實(shí)現(xiàn)超級好看的鼠標(biāo)小尾巴特效的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12JavaScript實(shí)現(xiàn)無刷新上傳預(yù)覽圖片功能
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)無刷新上傳預(yù)覽圖片功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-08-08微信小程序比較兩個數(shù)大小的實(shí)現(xiàn)方法
最近在工作中遇到一個需求,可以自動對比兩個數(shù)的大小,下面這篇文章主要給大家介紹了關(guān)于微信小程序比較兩個數(shù)大小的實(shí)現(xiàn)方法,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-03-03BootStrap模態(tài)框閃退問題實(shí)例代碼詳解
這篇文章主要介紹了BootStrap模態(tài)框閃退問題實(shí)例代碼詳解,需要的朋友可以參考下2018-12-12html+js實(shí)現(xiàn)動態(tài)顯示本地時間
顯示本地時間的方法有很多,在本文將為大家介紹下如何使用html+js實(shí)現(xiàn)動態(tài)顯示本地時間,感興趣的朋友可以了解下2013-09-09JavaScript監(jiān)聽和禁用瀏覽器回車事件實(shí)例
這篇文章主要介紹了JavaScript監(jiān)聽和禁用瀏覽器回車事件實(shí)例,本文直接給出示例代碼,需要的朋友可以參考下2015-01-01