【JavaScript everyメソッド】配列からすべて条件に一致するか確認する方法(everyの使い方)

どうもフロントエンドエンジニアのまさぴょんです！

今回は、JavaScriptの配列メソッド連載シリーズ everyメソッド編に入ります。

前回、紹介したsomeメソッドとは、真逆の機能になりますので、興味がある人は、someメソッドも確認してください。

【JavaScript someメソッド】配列内で1つでも条件に合致しているか判定する方法(someの使い方)

【JavaScriptの配列メソッド解説: some編】

1 配列メソッド every()とは？
2 Array.prototype.every() の構文
3 everyメソッドを使ってみよう！ Sample-Code①
4 everyメソッドを使ってみよう！ Sample-Code②
5 まとめ
6 JavaScript書籍 Ver. 中級-上級者向け
7 JavaScript書籍 Ver. 初級者向け
8 参考・引用
9 最近の投稿

配列メソッド every()とは？

every() メソッドは、列内のすべての要素が指定された関数で実装されたテストに合格するかどうかをテストします。これは論理値を返します。
引用元: MDN: Array.prototype.every()

と天下のMDN-Docが言っております。

everyは、「すべての」という意味を持つ英単語ですね。

前回紹介したsomeとは正反対の英単語になります。

その英語の原義からも、メソッド機能の意味を理解することができます。

配列から値を1つずつ取り出し「指定条件」にすべての要素が一致すれば「true」を返してくれるメソッド。それがeveryメソッドです。

逆に、1つでも条件に合致しなければ、メソッドの実行結果は「false」が返却されます。

Array.prototype.every() の構文

メソッドの基本の形を確認しましょう！

メソッドを理解する時に意識すべきなのは、「引数」(Parameter)と「実行結果」(返り値)です。

every()・基本の形

array.ever( (value, index, array)=> { 条件記述 } )

// 実行結果（返り値）は、Boolean(true/false)
// すべて「条件」に合致すれば、true

everyメソッドの第一引数には、CallBack関数が来ます。

上記では、アロー関数で記述しています。

そして、そのCallBack関数には、3つの引数が設定できます。

必須なのは、第一引数のvalueで第二・第三引数のindexとarrayは、省略できます。

value, index, array の意味は、それぞれ次のようになります。

value: 配列から取り出したvalue
index: 取り出している現在のindex番号
array: everyメソッドを呼び出している配列そのもの

この上記の特徴を把握すれば、everyメソッドの概要は理解できたと思います。

everyメソッドを使ってみよう！ Sample-Code①

それでは次にeveryメソッドを使ってみましょう！

以下のCodeをコピーして、ブラウザのコンソールなどで実行してみましょう！

// 1. everyメソッド: すべて条件に一致するかどうかCheck => 真偽値を返してくれる！
let sife = 7000;

const wishList = [1000, 2000, 3000, 4000, 5000];

let BuyAllEnableCheck = wishList.every( (v,i,a) => sife >= v );
console.log(BuyAllEnableCheck); // 出力結果: true

BuyAllEnableCheck ? console.log("すべて所持金で買える金額！") : console.log("所持金では買えない商品がある・・・");
// 出力結果: すべて所持金で買える金額！

上記のコードでは、「sife の所持金が wishList 以上かどうか？」という条件で判定して、欲しいものリストの商品たちが所持金で買える商品であるかどうかCheckしていますね。

このコードのsife変数の金額を変えたり、条件を変えてみたりして、コンソールで遊んでみてください。

everyメソッドを使ってみよう！ Sample-Code②

次のコードもコピーして、コンソールなどで実行してみてください。

// 1. 会議出席のアンケート・リスト①
const MeetingJoinListOne = [
    { joinFlag: true, name: "ロボ玉A", id: 1},
    { joinFlag: true, name: "ロボ玉B", id: 2},
    { joinFlag: true, name: "ロボ玉C", id: 3},
    { joinFlag: true, name: "ロボ玉D", id: 4},
    { joinFlag: true, name: "ロボ玉E", id: 5},
];

// 2. 会議出席のアンケート・リスト②
const MeetingJoinListTwo = [
    { joinFlag: true, name: "ロボ玉F", id: 1},
    { joinFlag: true, name: "ロボ玉G", id: 2},
    { joinFlag: false, name: "ロボ玉H", id: 3},
    { joinFlag: true, name: "ロボ玉I", id: 4},
    { joinFlag: true, name: "ロボ玉J", id: 5},
];

// 3. みんな会議に参加しないなら、会議は開かない！
MeetingJoinListOne.every( (value, index, array) => value.joinFlag ) ? console.log("会議開催！！") : console.log("会議は開かん！！");
// 出力結果： 会議開催！！

MeetingJoinListTwo.every( (value, index, array) => value.joinFlag ) ? console.log("会議開催！！") : console.log("会議は開かん！！");
// 出力結果： 会議は開かん！！