在所有的阵列方法里还有 every() 跟 some() ,听说是很冷门的两种方法,确实我在练习上也是蛮少用到的,不过既然是归类在阵列方法,其实也可以稍微了解一下他们的特性,我想这篇研究文大概是不会太长篇了。
every() 可以检查所有阵列的内容是否符合指定的条件,并只会回传一个值 true
或是 false
,用在需要比较严格把关资料的地方,因为只要有一个资料不符合指定条件,便会回传 false
。
every() 语法
arr.every(callback[, thisArg])
语法的解释其实前面几篇都有特别提到,这边就不再多做赘述了。另外,这里再提供一个例子,可以帮助更快理解:
let array = [
{
name: 'Abe',
like: '珍珠奶茶',
age: 20
},
{
name: 'Billy',
like: '青茶',
age: 30
},
{
name: 'Brittany',
like: '西瓜牛奶',
age: 25
},
{
name: 'Cecily',
like: '冰淇淋红茶',
age: 19
}
];
let ans = array.every(function(item, index, array){
console.log(item, index, array); // 物件, 索引, 全部阵列
return item.age > 10 // 当全部 age 大於 10 才能回传 true
});
console.log(ans); // false: 只要有部分不符合,则为 false
let ans2 = array.every(function(item, index, array){
return item.age < 30
});
console.log(ans2); // true: 全部 age 都小於 30
some() 方法同样是回传 true
或 false
,比较不同的地方是,some() 仅需要部分符合就会回传 true
,全部都不符合则会回传 false
。
以上面的阵列资料为例:
let ans2 = people.some(function(item, index, array){
return item.age < 25
});
console.log(ans2); // true: 只要有部分符合,则为 true
let ans2 = people.some(function(item, index, array){
return item.age > 31
});
console.log(ans2); // false: 全部都不符合则为 false
譬如说注册时会有几个栏位,我们使用某些框架架设後端,假如这几个栏位的值存在於某个後端资料里,这时候就可以使用 every() 方法去检查是否含有值。
// 这个范例是假设五个栏位的资料存在於 ctx.request.body 里
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() 在验证表单的部分则是以社群软件填选为例子,假设几个社群软件必须至少要留一个的时候:
const socialAccounts = ['facebook', 'twitter', 'github'];
if (socialAccounts.some(x => ctx.request.body[x] !== undefined)) {
// 至少有填写一个社群帐号
} else {
// 完全没有填写社群帐号
}
参考资料:
JavaScript 阵列中两个冷门的方法:Every、Some
JavaScript 阵列处理方法
<<: 铁人赛 Day24 -- JavaScript 初体验(二) -- 点击後换图片
是菜稽还是老稽,大部份可以看他们稽核的顺序来辨别, 有一阵子观察五年以上的资深前辈,会从内稽、管审开...
「这是个性很急,却也快不了的一整个世代。」 那,我们该改用什麽样的态度,跟年轻同事相处? 没有, 绝...
今天要来讲的东西,主要是来自笔者以前看过很喜欢的文章(https://www.ithome.com....
我们先来画我们的计数器吧! 为了让我们的计数器精美一点点点, 我们先来安装React的fontAwe...
前言: 在Activity 和 Fragment 只要操作 xml 的元件,在 onCreate 时...