以前、JavaScriptのreduce関数の処理の流れを図解化してみるというブログを書きましたが、この時にも「ああ、JavaScriptにも色々便利な関数があったり、新しく増えてきたものなんだな」ということを強く思いました。
が、まだまだありました。JavaScriptにおける便利な命令。それは「every」
きっとエキスパートな方々はご存知なのでしょうか、 JavaScriptのevery関数について、今回は紹介したいと思います!
JavaScriptのevery関数とは何者か?some関数などと比較して紹介
JavaScriptのevery関数とは、一体どんなものなのでしょうか。
MDNさんのページによれば、「配列内の全ての要素に対してテストを行う」「配列内の全ての要素に該当すれば、true。そうでない場合はfalseを返す」といった説明がなされています。
わりかしセットで紹介されているのがsome関数。
こちらは、配列の中で1つでも指定条件に該当するものがあればtrue、そうでない場合はfalseを返すというものになっています。
ということは、言い換えるならば、everyメソッドは配列の中の要素が指定条件に全て該当すればtrue、そうでない場合はfalseを返すというものになるわけですね!
everyメソッドを実際に使ってみる
サンプルコードを用いて、everyメソッドを使ってみました。
See the Pen WKVLJx by majikari-keruo (@castero) on CodePen.
多重構造になった配列を使っています。
bingoSeat[0].every((value)=>value==1) という部分がありますが、要するにこれは一番最初の配列の中身が全て1なのかどうか、ということをevery関数を使って確認しています。
一番最初の配列の中身は全て1になっているので、この場合、結果はtrueが返されるようになっています。
それに対して、2番目の配列には0が混ざっています。そのため。bingoSeat[1].every((value)=>value==1)の部分の結果は、falseが返ってくるわけなのです。
ちなみに僕は、このevery関数を使ってJavaScriptでbingoカードを作って、横列のビンゴ判定を出す時にこのeveryメソッドを使いました。
これが驚くほど便利だったのでこの記事を作ったという流れです!笑
実際のWebサービス制作においては、一体どんな場面で使えるのか、わかったら追記しようと思います。
まとめ
ということで、今回はJavaScriptのeveryメソッドについて紹介させていただきました!
JavaScriptの関数、まだまだ便利な命令がたくさんありそうですね!これからも発見したら紹介したいと思います!