JS學(xué)習(xí)筆記之?dāng)?shù)組去重實(shí)現(xiàn)方法小結(jié)
本文實(shí)例講述了JS學(xué)習(xí)筆記之?dāng)?shù)組去重實(shí)現(xiàn)方法。分享給大家供大家參考,具體如下:
操作的數(shù)組
let arr=[0,1,23,'1',4,2,8,5,5,6,9,'asdasd','5']
1、
利用ES6 的set 來進(jìn)行數(shù)組去重

console.time("set")
let type1=new Set(arr)
console.log(type1)
type1=[...type1]
console.log(type1)
console.timeEnd("set")
2、
利用indexof和forEach 多次遍歷來搜索是否有相同的值

console.time("indexOf")
let type2=[]
arr.forEach(function(item,index){
if(type2.indexOf(item)<0){
type2.push(item)
}
})
console.log(type2)
console.timeEnd("indexOf")
3、
雙循環(huán)實(shí)現(xiàn)數(shù)組去重
splice() 方法向/從數(shù)組中添加/刪除項(xiàng)目,然后返回被刪除的項(xiàng)目。
缺點(diǎn) 會對元素組造成影響,所以建議先拷貝數(shù)組

console.time("splice")
let arr2=[0,1,23,'1',4,2,8,5,5,6,9,'asdasd','5']
for(let i=0;i<arr2.length;i++){
for(let j=i+1;j<arr2.length;j++){
if(arr2[i]===arr2[j]){
arr2.splice(i,1)
}
}
}
console.log(arr2)
console.timeEnd("splice")
4、
利用 對象屬性 不重復(fù)的特性 以及 typeof 來實(shí)現(xiàn)數(shù)組去重

console.time("obj屬性")
let obj1={}
let type4=[]
arr.forEach(function(item,index){
let tf=typeof item
if(!obj1[tf+"_"+item]){
obj1[tf+"_"+item]=true
}
})
console.log(obj1)
for(item in obj1){
type4.push(item.split("_")[0].toLowerCase()=="number"?+item.split("_")[1]:item.split("_")[1])
}
obj1=null;
console.log(type4)
console.timeEnd("obj屬性")
5、
利用sort排序 相同值就會被排列到一起
會對元素組產(chǎn)生操作

console.time("sort排序")
let arr3=[0,1,23,'1',4,2,8,5,5,6,9,'asdasd','5']
arr3.sort()
for(let i=0;i<arr3.length;i++){
if(arr3[i]===arr3[i+1]){
arr3.splice(i,1)
}
}
console.log(arr3)
console.timeEnd("sort排序")
效果展示

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。
PS:這里再為大家提供幾款相關(guān)工具供大家參考使用:
在線去除重復(fù)項(xiàng)工具:
http://tools.jb51.net/code/quchong
在線文本去重復(fù)工具:
http://tools.jb51.net/aideddesign/txt_quchong
更多關(guān)于JavaScript相關(guān)內(nèi)容還可查看本站專題:《JavaScript數(shù)組操作技巧總結(jié)》、《JavaScript字符與字符串操作技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》及《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript實(shí)現(xiàn)簡單版的留言發(fā)布與刪除
這篇文章主要介紹了如何通過JavaScript實(shí)現(xiàn)簡單的留言板功能:留言的發(fā)布與刪除。文中的示例代碼講解詳細(xì),感興趣的小伙伴可以學(xué)習(xí)一下2022-03-03
ng-options和ng-checked在表單中的高級運(yùn)用(推薦)
AngularJS是當(dāng)前非常的流行的前端框架,它的語法糖非常多,也極大的方便了前端開發(fā)者。這篇文章主要介紹了ng-options和ng-checked在表單中的高級運(yùn)用,需要的朋友可以參考下2017-01-01
javascript實(shí)現(xiàn)炫酷的拖動分頁
非??岬膉avascript拖動分頁功能,無縫循環(huán)分頁,拖動鼠標(biāo)即可完成分頁,鼠標(biāo)向左拖動回到前一頁,向右拖動則翻開第二頁,還帶有動畫特效,著實(shí)很不錯(cuò),界面黑色,非主流風(fēng)格,相信很多人會喜歡的。2015-05-05
通過實(shí)例理解javascript中沒有函數(shù)重載的概念
這篇文章主要介紹了通過實(shí)例理解javascript中沒有函數(shù)重載的概念,十分的簡單易懂,需要的朋友可以參考下2015-06-06
深入分析javascript中的錯(cuò)誤處理機(jī)制
這篇文章主要介紹了深入分析javascript中的錯(cuò)誤處理機(jī)制的相關(guān)資料,需要的朋友可以參考下2016-07-07

