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