javascript中關(guān)于去重操作的使用
前言:
前端開發(fā)里面,在JS中關(guān)于數(shù)據(jù)去重操作的使用是非常常用,也是非常重要的點(diǎn),一般情況下關(guān)于對(duì)數(shù)組去重點(diǎn)操作是最常用的,其次是具體的關(guān)于某一數(shù)據(jù)類型的去重操作,如字符串去重、數(shù)字去重等。那么本篇博文就來分享一下去重操作的使用,方便后期查閱使用。
核心的基本算法
遍歷拿到的數(shù)據(jù)數(shù)組,然后把該數(shù)組中的元素存放到新的數(shù)組中,在存放到新數(shù)組之前要檢查數(shù)組的元素是否已經(jīng)存在,如果存在(相同元素,即重復(fù)元素)就不再放入新的數(shù)組中。
數(shù)據(jù)去重的基本用法
在JS中關(guān)于去重操作的使用一般是關(guān)于數(shù)組去重、字符串去重、數(shù)字去重,具體的使用示例如下所示。
1、數(shù)組去重
數(shù)組去重有三種方法:
- 方法一:indexOf循環(huán)去重;
- 方法二:ES6的Set去重;Array.from(new Set(arr));
- 方法三:Object 鍵值對(duì)去重;把數(shù)組的值存成 Object 的 key 值,比如 Object[valuea] = true, 在判斷另一個(gè)值的時(shí)候,如果 Object[valueb]存在的話,就說明該值是重復(fù)的。
這里只拿indexOf 循環(huán)去重來做示例,??
示例數(shù)組:
var array = [1, 2, 3, 4, 5, 5, 4, 3, 2,1];
處理方法:
function repeat(array){ var array1 = []; // 新建數(shù)組用來存array的值 for(var i=0,leng=array.length;i<leng;i++){ if(array1.indexOf(array[i]) === -1){ array1.push(array[i]); } } return array1; } console.log(unique(array)); // 數(shù)組輸出結(jié)果: [ 1, 2, 3, 4, 5]
注意:indexOf是ES5新增加的函數(shù),用來獲取數(shù)組中元素的位置(下標(biāo)),兼容性IE8+。
2、字符串去重
示例字符串:
var str = "12345678987654321”;
處理方法:
function repeat(str){ var str1 = ""; //用來接收去重后的字符串 for(var i in str){ if(str1.indexOf(str.charAt(i)) == -1){ str1+=str.charAt(i); } } return str1; // 返回去重后的字符串 } // 輸出結(jié)果repeat("123456789"); // 字符串轉(zhuǎn)換成數(shù)組 function repeat1(str){ var array = str.slice(""); var str1 = uniqueArray(array); return str1.join(""); } console.log(repeat1(str)); //輸出結(jié)果repeat1("123456789");
3、數(shù)字去重
接著上面字符串去重的思路就比較簡(jiǎn)單許多,首先把數(shù)字轉(zhuǎn)換成字符串,然后再做處理。12345678987654321去重之后結(jié)果為123456789。
示例字符串:
var str = "12345678987654321”;
處理方法:
function repeat(num){ var str = num + ""; var num1 = repeat(str); return parseInt(num1); } console.log(repeat(num)); // 輸出結(jié)果repeat(123456789);
最后
通過上面介紹的JS中關(guān)于去重操作的使用匯總,常用的去重算法通過本文內(nèi)容就可涵蓋,在Vue.js開發(fā)中的使用就游刃有余了,這也是在開發(fā)過程中必用的功能,尤其是對(duì)于初中級(jí)開發(fā)者來說,更應(yīng)該掌握這些情況的使用,這里不再贅述。
到此這篇關(guān)于javascript中關(guān)于去重操作的使用的文章就介紹到這了,更多相關(guān)JS去重操作內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
require.js配合插件text.js實(shí)現(xiàn)最簡(jiǎn)單的單頁(yè)應(yīng)用程序
這篇文章主要介紹了require.js配合插件text.js實(shí)現(xiàn)最簡(jiǎn)單的單頁(yè)應(yīng)用程序,需要的朋友可以參考下2016-07-07uniapp基礎(chǔ)篇之上傳圖片的實(shí)戰(zhàn)步驟
應(yīng)用uni-app開發(fā)跨平臺(tái)App項(xiàng)目時(shí),上傳圖片、文檔等資源功能需求十分常見,下面這篇文章主要給大家介紹了關(guān)于uniapp基礎(chǔ)篇之上傳圖片的相關(guān)資料,需要的朋友可以參考下2022-12-12純js實(shí)現(xiàn)重發(fā)驗(yàn)證碼按鈕倒數(shù)功能
這篇文章主要介紹了純js實(shí)現(xiàn)重發(fā)驗(yàn)證碼按鈕倒數(shù)功能,本文整理了兩個(gè)實(shí)現(xiàn)代碼,需要的朋友可以參考下2015-04-04js驗(yàn)證真實(shí)姓名與身份證號(hào)是否匹配
使用javascript技術(shù)驗(yàn)真實(shí)姓名,要用到unicode字符來匹配,由于中國(guó)人的姓名長(zhǎng)度一般是在2-4這個(gè)范圍內(nèi),所以重復(fù)匹配{2,4}次。接下來,通過本文給大家分享js驗(yàn)證省份證號(hào)與真實(shí)姓名是否匹配,需要的朋友可以參考下2015-10-10基于jquery的高性能td和input切換并可修改內(nèi)容實(shí)現(xiàn)代碼
在實(shí)際工作中,我們會(huì)碰到這樣一個(gè)情況。在頁(yè)面中顯示著100個(gè)數(shù)據(jù),同時(shí)用戶還希望他可以更改其中的數(shù)據(jù),普通的方式可能如下2011-01-01JavaScript Canvas實(shí)現(xiàn)井字棋游戲
這篇文章主要為大家詳細(xì)介紹了JavaScript Canvas實(shí)現(xiàn)井字棋游戲,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-08-08CSS、JS文件無法正確加載至頁(yè)面問題與解決辦法分享
這篇文章主要給大家介紹了關(guān)于CSS、JS文件無法正確加載至頁(yè)面問題與解決辦法,文中通過圖文以及代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2024-01-01