快捷導(dǎo)航

JS實(shí)現(xiàn)的字符串?dāng)?shù)組去重功能小結(jié)

更新時間：2019年06月17日 09:47:29 作者：longzhoufeng

這篇文章主要介紹了JS實(shí)現(xiàn)的字符串?dāng)?shù)組去重功能,結(jié)合實(shí)例形式分析了javascript基于ES6、ES5、ES3及正則實(shí)現(xiàn)數(shù)組去重的相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)的字符串?dāng)?shù)組去重功能。分享給大家供大家參考，具體如下：

這里只考慮最簡單字符串的數(shù)組去重，暫不考慮，對象，函數(shù)，NaN等情況，這種用正則實(shí)現(xiàn)起來就吃力不討好了。

非正則實(shí)現(xiàn)：ES6實(shí)現(xiàn)

<script>
let str_arr=["b","c",1,"a", 3,"v", "2","e", "6","g", "9", "arr",9, "hello",",6", "9", "1", 2, 6, "b", "c"]
function unique(arr){
 return [...new Set(arr)]
}
console.log(unique(str_arr)) 
</script>

運(yùn)行結(jié)果：

ES5實(shí)現(xiàn)

<script>
var str_arr = ["b","c",1,"a", 3,"v", "2","e", "6","g", "9", "arr",9, "hello",",6", "9", "1", 2, 6, "b", "c"]
  function unique(arr) {
    return arr.filter(function(ele, index, array) {
      return array.indexOf(ele) === index
    })
  }
  console.log(unique(str_arr))
</script>

運(yùn)行結(jié)果同上

ES3實(shí)現(xiàn)

<script>
var str_arr = ["b","c",1,"a", 3,"v", "2","e", "6","g", "9", "arr",9, "hello",",6", "9", "1", 2, 6, "b", "c"]
function unique(arr) {
  var obj = {},
    array = []
  for (var i = 0, len = arr.length; i < len; i++) {
    var key = arr[i] + typeof arr[i]
    if (!obj[key]) {
      obj[key] = true
      array.push(arr[i])
    }
  }
  return array
}
console.log(unique(str_arr))
</script>

運(yùn)行結(jié)果同上

用正則實(shí)現(xiàn)

<script>
 var str_arr = ["b","c",1,"a", 3,"v", "2","e", "6","g", "9", "arr",9, "hello",",6", "9", "1", 2, 6, "b", "c"]
 function unique(arr) {
   return arr.sort().join(",,").
   replace(/(,|^)([^,]+)(,,\2)+(,|$)/g, "$1$2$4").
   replace(/,,+/g, ",").
   replace(/,$/, "").
   split(",")
 }
 console.log(unique(str_arr))
</script>

運(yùn)行結(jié)果：

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

PS：這里再為大家提供幾款相關(guān)工具供大家參考使用：

在線去除重復(fù)項工具：
http://tools.jb51.net/code/quchong

在線文本去重復(fù)工具：
http://tools.jb51.net/aideddesign/txt_quchong

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

利用location.hash實(shí)現(xiàn)跨域iframe自適應(yīng)
其他一些類似js跨域操作問題也可以按這個思路去解決，需要的朋友可以測試下。
2010-05-05
基于JavaScript中標(biāo)識符的命名規(guī)則介紹
下面小編就為大家分享一篇基于JavaScript中標(biāo)識符的命名規(guī)則介紹，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-01-01
JavaScript跨平臺的開源框架NativeScript
本文給大家分享的是一款使用javascript來構(gòu)建跨平臺原生移動應(yīng)用的開源框架--NativeScript，可以使用JavaScript開發(fā)跨平臺、真正原生的iOS, Android 和 Windows 移動App。開發(fā)人員使用NativeScript提供的庫來構(gòu)建應(yīng)用UI，其抽象了各種原生平臺之間的不同。
2015-03-03
js 字符串轉(zhuǎn)換成數(shù)字的三種方法
在js讀取文本框或者其它表單數(shù)據(jù)的時候獲得的值是字符串類型的,例如兩個文本框a和b,如果獲得a的value值為11,b的value值為9 ,那么a.value要小于b.value,因?yàn)樗麄兌际亲址问降?在網(wǎng)上找了一下js字符串轉(zhuǎn)數(shù)字的文章,這個比較全
2013-03-03
JS中獲取數(shù)據(jù)庫中的值的方法
在項目中遇到一個問題，需要在JS中讀取數(shù)據(jù)庫中的值，然后再把值返回到頁面中，解決方案如下:使用Ajax方法來實(shí)現(xiàn)，需要用到ajax.dll（一個ajax技術(shù)開發(fā)的幫助類庫）。
2013-07-07
基于JS如何實(shí)現(xiàn)類似QQ好友頭像hover時顯示資料卡的效果(推薦)
通過本文給大家介紹鼠標(biāo)經(jīng)過好友列表中的好友頭像時顯示資料卡的效果，非常不錯具有參考借鑒價值，感興趣的朋友一起看下吧
2016-06-06
Bootstrap每天必學(xué)之導(dǎo)航條
Bootstrap每天必學(xué)之導(dǎo)航條，本文向大家講解了多種多樣的導(dǎo)航條，以及導(dǎo)航條中元素的實(shí)現(xiàn)方法，感興趣的小伙伴們可以參考一下
2015-11-11
JavaScript實(shí)現(xiàn)限時秒殺功能
各種電商活動都喜換選擇限時秒殺活動形式，這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)限時秒殺功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-08-08
javascript使用for循環(huán)批量注冊的事件不能正確獲取索引值的解決方法
這篇文章主要介紹了javascript使用for循環(huán)批量注冊的事件不能正確獲取索引值的解決方法,對比分析了出現(xiàn)問題的代碼與修改后的代碼,并給出了采用閉包實(shí)現(xiàn)的方法,具有一定的參考借鑒價值,需要的朋友可以參考下
2014-12-12
javascript 拖放效果實(shí)現(xiàn)代碼
JavaScript擅長于修改頁面中的DOM元素，但是我們使用JavaScript通常只是實(shí)現(xiàn)一些簡單功能，例如實(shí)現(xiàn)圖片的翻轉(zhuǎn)，網(wǎng)頁中的標(biāo)簽頁，等等。這篇文章將向你展示如何在頁面中，對創(chuàng)建的元素實(shí)現(xiàn)拖放。
2010-01-01