JS數(shù)組去重的6種方法完整實(shí)例
本文實(shí)例講述了JS數(shù)組去重的6種方法。分享給大家供大家參考,具體如下:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>chabaoo.cn 數(shù)組去重</title> </head> <body> <script> //1.filter:(indexOf)方法創(chuàng)建一個(gè)新的數(shù)組,新數(shù)組中的元素是通過(guò)檢查指定數(shù)組中符合條件的所有元素, filter() 不會(huì)對(duì)空數(shù)組進(jìn)行檢測(cè)。 filter() 不會(huì)改變?cè)紨?shù)組。 var arr1 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr1_1 = arr1.filter(function(m, n) { return arr1.indexOf(m) == n; }) document.write(arr1_1 + "<br />"); //2.map:(push indexOf)把每個(gè)元素通過(guò)函數(shù)傳遞到當(dāng)前匹配集合中,生成包含返回值的新的 jQuery 對(duì)象。 var arr2 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr2_2 = []; arr2.map(function(m, n) { if(arr2.indexOf(arr2[n]) == n) { arr2_2.push(m); } }); document.write(arr2_2 + "<br />"); //3.indexOf(push)搜索數(shù)組中的元素,并返回它所在的位置。 var arr3 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var arr3_3 = []; for(var i = 0; i < arr3.length; i++) { if(arr3_3.indexOf(arr3[i]) == -1) { arr3_3.push(arr3[i]); } } document.write(arr3_3 + "<br />"); //4.splice對(duì)數(shù)組進(jìn)行刪除、插入、替換,是最強(qiáng)大的數(shù)組方法。改變?cè)瓟?shù)組 var arr4 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; for(var i = 0; i < arr4.length; i++) { for(var j = i + 1; j < arr4.length; j++) { if(arr4[i] == arr4[j]) { arr4.splice(j, 1) j--; //別忘記減 } } } document.write(arr4 + "<br />"); //5.push(數(shù)組去重一一對(duì)比)添加到數(shù)組末尾 var arr5 = [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; function remm(arr) { var arr5_5 = []; for(var i = 0; i < arr5.length; i++) { for(var j = 0; j < arr5.length; j++) { if(arr5[i] == arr5_5[j]) { break; } } if(arr5[i] != arr5_5[j]) { arr5_5.push(arr5[i]); } } return arr5_5; } document.write(remm(arr5) + "<br />"); //6.set數(shù)據(jù)結(jié)構(gòu)Set類(lèi)似于數(shù)組,但是成員的值都是唯一的,沒(méi)有重復(fù)的值。用set.size表示偽數(shù)組長(zhǎng)度 var arr6= [7, 7, 7, 8, 8, 8, 82, 82, 839, 49, 329, 8, 3, 3]; var set = new Set(arr6); var newArr = new Array(...set); document.write(newArr+"<br />"); </script> </body> </html>
使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼,可得到如下運(yùn)行結(jié)果:
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)容還可查看本站專(zhuān)題:《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é)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JS實(shí)現(xiàn)同時(shí)搜索百度和必應(yīng)的方法
這篇文章主要介紹了JS實(shí)現(xiàn)同時(shí)搜索百度和必應(yīng)的方法,可實(shí)現(xiàn)在底部的兩個(gè)框架中同時(shí)顯示兩個(gè)搜索引擎的搜索結(jié)果,是非常實(shí)用的技巧,需要的朋友可以參考下2015-01-01uniapp與webview之間的相互傳值的實(shí)現(xiàn)
這篇文章主要介紹了uniapp與webview之間的相互傳值的實(shí)現(xiàn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06JavaScript6 let 新語(yǔ)法優(yōu)勢(shì)介紹
這篇文章主要介紹了JavaScript6 let 新語(yǔ)法優(yōu)勢(shì)介紹的相關(guān)資料,需要的朋友可以參考下2016-07-07JS實(shí)現(xiàn)的判斷方法、變量是否存在功能示例
這篇文章主要介紹了JS實(shí)現(xiàn)的判斷方法、變量是否存在功能,涉及javascript針對(duì)變量、方法判斷與異常處理操作技巧,需要的朋友可以參考下2018-05-05關(guān)于JavaScript數(shù)組對(duì)象去重的幾種方法
這篇文章主要介紹了關(guān)于JavaScript數(shù)組對(duì)象去重的幾種方法,不管是map對(duì)象的特性還是reduce方法都是很好用的去重方法,需要的朋友可以參考下2023-04-04