JS數(shù)組方法some、every和find的使用詳情
1、some
在MDN中這樣定義:some()
方法測(cè)試數(shù)組中是不是至少有1個(gè)元素通過(guò)了被提供的函數(shù)測(cè)試。它返回的是一個(gè)Boolean
類(lèi)型的值。
簡(jiǎn)而言之就是:它對(duì)數(shù)組中的每一項(xiàng)進(jìn)行校驗(yàn),只要有一項(xiàng)通過(guò)了就是true
。
- 它只會(huì)返回
true
或false
- 它會(huì)對(duì)數(shù)組中的每一項(xiàng)進(jìn)行檢測(cè),千萬(wàn)不要在
some
里面進(jìn)行if else
操作 - 不要在
return
后面寫(xiě)true
或false
,return
后面跟的是你的條件
最近做后臺(tái)管理系統(tǒng)遇到一個(gè)需求:彈出一個(gè)Dialog
,只要這個(gè)Dialog
里面的input
有一個(gè)有值,就可以;否則提示至少要有一個(gè)值。
數(shù)據(jù)結(jié)構(gòu)如下,使用some
let arr = [ { value: "apple" }, { value: "" }, { value: "banana" }, { value: "orange" }, { value: "" }, ] let res = arr.some(item=>{ return item.value !== "" }) console.log(res);
在這里,只要有值,res
就為true
,所以我們可以在res
為true
時(shí)進(jìn)行下一步操作。
if (res) { console.log("數(shù)組有值"); } else { console.log("至少輸入一個(gè)值"); }
2、every
every
的使用方法和some
一樣。 在MDN中:every()
方法測(cè)試一個(gè)數(shù)組內(nèi)的所有元素是否都能通過(guò)某個(gè)指定函數(shù)的測(cè)試。它返回一個(gè)布爾值。
簡(jiǎn)而言之就是:它對(duì)數(shù)組中的每一項(xiàng)進(jìn)行校驗(yàn),只要有一項(xiàng)不通過(guò)它就是false
。
注意事項(xiàng)與some
一樣。 如果要求每一個(gè)輸入框中都必須有值時(shí),
let arr2 = [ { value: "apple" }, { value: "" }, { value: "banana" }, { value: "orange" }, { value: "er" }, ] var res2 = arr2.every(item => { return item.value !== "" }) console.log(res2);
在這里,只要有一項(xiàng)沒(méi)有值,res2
就為false
。
if (!res2) { //res2為真,則走else;為假,則走if console.log("輸入框有空值"); } else { console.log("輸入框沒(méi)空值"); console.log("進(jìn)行下步操作"); }
3、find
在MDN
中,find()
方法返回?cái)?shù)組中滿(mǎn)足提供的測(cè)試函數(shù)的第一個(gè)元素的值。否則返回 undefined
注意:find()和上面兩個(gè)不一樣,它返回的是值,而且是第一個(gè)滿(mǎn)足條件的值
let arr3 = [ { value: "" }, { value: "" }, { value: "" }, { value: "" }, { value: "apple" }, ] var res3 = arr3.find(item => { return item.value !== "" }) console.log(res3);
可以根據(jù)find
的返回值是否為undefined
來(lái)判斷item
中valu
e,
if (res3) { //res3有值,在這里進(jìn)行下一步操作。 console.log("數(shù)組中至少有一個(gè)值"); } else { //res3為undefined console.log("數(shù)組為空!"); }
到此這篇關(guān)于JS數(shù)組方法some、every
和find
的使用詳情的文章就介紹到這了,更多相關(guān)JS數(shù)組方法some
、every
和find
的使用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
微信小程序 視圖層(xx.xml)和邏輯層(xx.js)詳細(xì)介紹
這篇文章主要介紹了微信小程序 視圖層(xx.xml)和邏輯層(xx.js)詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2016-10-10微信小程序 定義全局?jǐn)?shù)據(jù)、函數(shù)復(fù)用、模版等詳細(xì)介紹
這篇文章主要介紹了微信小程序 定義全局?jǐn)?shù)據(jù)、函數(shù)復(fù)用、模版等詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2016-10-10微信小程序 獲取javascript 里的數(shù)據(jù)
這篇文章主要介紹了微信小程序 獲取javascript 里的數(shù)據(jù)的相關(guān)資料,這里通過(guò)實(shí)例來(lái)說(shuō)明如何獲取javascript里的數(shù)據(jù),希望能幫助到大家,需要的朋友可以參考下2017-08-08package.json依賴(lài)環(huán)境相關(guān)屬性詳解
這篇文章主要為大家介紹了package.json依賴(lài)環(huán)境相關(guān)屬性詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-09-09微信小程序 開(kāi)發(fā)之頂部導(dǎo)航欄實(shí)例代碼
這篇文章主要介紹了微信小程序 開(kāi)發(fā)之頂部導(dǎo)航欄實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2017-02-02