search
尋找貓咪~QQ 地點 桃園市桃園區 Taoyuan , Taoyuan

JavaScript 陣列中兩個冷門的方法:Every、Some

JavaScript 的陣列中,除了常用的 sortmap 以外,其實還有 everysome。這兩個方法好像比較不常用到,寫篇文來講講怎麼使用,跟什麼時候可以使用。

filter

先從 Array.filter 開始講好了,順便複習一下 ES6。假設今天有一坨資料是這樣:

const students = [
    {
        name: 'Daniel',
        age: 22,
        country: 'Malaysia'
    },
    {
        name: 'Noob',
        age: 21,
        country: 'Taiwan'
    },
    {
        name: 'Coin',
        age: 17,
        country: 'Taiwan',
    }
]

透過 ES6 的語法,搭配 filter,我們可以很輕易找出大於 18 歲的人:

const result = students.filter(x => x.age >= 18);
// 執行結果:result 為一個陣列,包含兩個物件。

some

Array.some 是用來檢查陣列裡面是否有一些符合條件。只要有一個以上符合條件就會回傳 true,全部都不是的話會回傳 false

例如:

const result = students.some(x => x.age >= 18);
// 執行結果:result 為 true
const result2 = students.some(x => x.country === 'Singapore');
// 執行結果:result 為 false

every

Array.everysome 類似,不過要陣列裡面的所有東西都符合條件才會回傳 true,只要有一個不是就會回傳 false

例如:

const result = students.every(x => x.age >= 18);
// 執行結果:result 為 false

使用 every、some 做表單驗證

這兩個函式平常好像不會用到,但其實 every 可以用來做後端的表單驗證。比方說註冊時前端會傳來幾個欄位:userpasswordgendernameemail,然後我們使用 koakoa-body這兩個套件架後端,假設這些資料存在 ctx.request.body 裡面好了。

換句話說,ctx.request.body 含有這五個欄位。

這時就可以用 every 來檢查他們是不是都含有值:

if (Object.values(ctx.request.body).every(x => x !== undefined)) {
    // 欄位都不是空值
} else {
    // 有些欄位是空值
}

如果你擔心前端會少送幾個東西過來,騙過驗證的話,也可以這樣檢查:

const requirements = ['user', 'password', 'gender', 'name', 'email'];
if (requirements.every(x => ctx.request.body[x] !== undefined)) {
    // 必要的欄位都不是空值
} else {
    // 有些必要的欄位是空值
}

這樣就可以確保這五個欄位都不是空的了。

同樣 some 也可以用來這樣檢查。假設 facebooktwittergithub 的社群帳號他一定要有留至少一個,不能都不填的話,就可以這樣做:

const socialAccounts = ['facebook', 'twitter', 'github'];
if (socialAccounts.some(x => ctx.request.body[x] !== undefined)) {
    // 至少有填寫一個社群帳號
} else {
    // 完全沒有填寫社群帳號
}


熱門推薦

本文由 noobtw 提供 原文連結

寵物協尋 相信 終究能找到回家的路
寫了7763篇文章,獲得2次喜歡
留言回覆
回覆
精彩推薦