es6數(shù)組includes()用法實例分析
本文實例講述了es6數(shù)組includes()用法。分享給大家供大家參考，具體如下：
Array.prototype.includes方法返回一個布爾值，表示某個數(shù)組是否包含給定的值，與字符串的includes方法類似。ES2016引入了該方法。
[1, 2, 3].includes(2) // true [1, 2, 3].includes(4) // true [1, 2, NaN].includes(NaN) // true
該方法的第二個參數(shù)表示搜索的起始位置，默認為0。如果第二個參數(shù)為負數(shù)，則表示倒數(shù)的位置，如果這時它大于數(shù)組長度(比如第二個參數(shù)為-4， 但數(shù)組長度為3)，則會重置為0開始。
[1, 2, 3].includes(3, 3); // false [1, 2, 3].includes(3, -1); // true
沒有該方法之前，我們通常使用數(shù)組的indexOf方法，檢查是否包含某個值。
if (arr.indexOf(el) !== -1) {
// ...
}
indexOf方法有兩個缺點，一是不夠語義化，它的含義是找到參數(shù)值的第一個出現(xiàn)位置，所以要去比較是否不等于-1,表達起來不夠直觀。二是，它內(nèi)部使用嚴格相等運算符進行判斷，這會導(dǎo)致對NaN的誤判。
[NaN].indexOf(NaN) // -1
includes使用的是不一樣的判斷算法，就沒有這個問題。
[NaN].includes(NaN) // true
下面代碼用來檢查當(dāng)前環(huán)境是否支持該方法，如果不支持，部署一個簡易的替代版本。
const contains = (() => Array.prototype.includes ? (arr, value) => arr.includes(value) :(arr, value) => arr.some(el => el === value) )()
另外，Map和Set數(shù)據(jù)結(jié)構(gòu)有一個has方法需要注意與includes區(qū)分。
-Map結(jié)構(gòu)的has方法，是用來查找鍵名的，比如Map.prototype.has(key),
WeakMap.prototype.has(key), Reflect.has(target, propertyKey)
-Set結(jié)構(gòu)的has方法，是用來查找值的，比如Set.prototype.has(value),
WeakSet.prototype.has(value)
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
bootstrap datepicker插件默認英文修改為中文
這篇文章主要為大家詳細介紹了bootstrap datepicker插件默認英文修改為中文的方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
JavaScript模仿Pinterest實現(xiàn)圖片預(yù)加載功能
圖片預(yù)加載是web開發(fā)中一種應(yīng)用相當(dāng)廣泛的技術(shù)，比如我們在做圖片翻轉(zhuǎn)顯示等特效的時候，為了讓圖片在轉(zhuǎn)換的時候不出現(xiàn)等待，我們最好是先讓圖片下載到本地，然后在繼續(xù)執(zhí)行后續(xù)的操作。今天本文主要介紹的是利用JS模仿Pinterest圖片社交網(wǎng)站的圖片預(yù)加載功能。2016-10-10
這篇文章主要介紹了js之切換全屏和退出全屏實現(xiàn)代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-09-09
javascript在網(wǎng)頁中實現(xiàn)讀取剪貼板粘貼截圖功能
這篇文章主要介紹了在網(wǎng)頁中實現(xiàn)讀取剪貼板粘貼截圖功能,即可以把剪貼板的截圖Ctrl+V粘貼到網(wǎng)頁的一個輸入框中,例如QQ截圖、旺旺截圖或者其它截圖軟件,需要的朋友可以參考下2014-06-06
這篇文章主要介紹了ES6實現(xiàn)的遍歷目錄函數(shù),涉及ES6文件目錄的遍歷、讀取、回調(diào)函數(shù)及json相關(guān)操作技巧,需要的朋友可以參考下2017-04-04
基于javascript實現(xiàn)動態(tài)顯示當(dāng)前系統(tǒng)時間
這篇文章主要介紹了基于javascript實現(xiàn)動態(tài)顯示當(dāng)前系統(tǒng)時間，以一個完整實例形式較為詳細的分析了js動態(tài)顯示當(dāng)前系統(tǒng)時間的實現(xiàn)技巧，需要的朋友可以參考下2016-01-01
如何使用JS寫個方法判斷當(dāng)前時區(qū)是否是夏令時
文章介紹了如何使用JavaScript判斷當(dāng)前時區(qū)是否處于夏令時,由于JavaScript標準庫沒有直接提供此功能,可以通過比較本地時間和UTC時間的差異來推斷,文章還提供了使用moment.js和moment-timezone插件進行更精確夏令時檢測的示例,感興趣的朋友一起看看吧2024-12-12
Google韓國首頁圖標動畫效果...2007-08-08
這篇文章主要介紹了JS判斷頁面是否出現(xiàn)滾動條的方法,涉及javascript針對頁面元素的讀取與判定實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07
PHP實現(xiàn)基于Redis的MessageQueue隊列封裝操作示例
這篇文章主要介紹了PHP實現(xiàn)基于Redis的MessageQueue隊列封裝操作,結(jié)合實例形式分析了Redis的PHP消息隊列封裝與使用相關(guān)操作技巧,需要的朋友可以參考下2019-02-02