JavaScriptのeveryメソッドが便利すぎる!配列の中身を一括で条件判定・検索したい時に重宝

JavaScriptのeveryメソッドが便利すぎる!配列の中身を一括で条件判定・検索したい時に重宝 JavaScript
JavaScriptのreduce関数の処理の流れを図解化してみる
JavaScriptにreduceという関数があるのですが、reducce関数は非常に便利なものです。 でも、ちょっと使わないとすぐ処理の流れ・というか使い方を忘れてしまうので、せっかくの自分のブログ、自分のためにもreduce関数の...

以前、JavaScriptのreduce関数の処理の流れを図解化してみるというブログを書きましたが、この時にも「ああ、JavaScriptにも色々便利な関数があったり、新しく増えてきたものなんだな」ということを強く思いました。

が、まだまだありました。JavaScriptにおける便利な命令。それは「every」

きっとエキスパートな方々はご存知なのでしょうか、 JavaScriptのevery関数について、今回は紹介したいと思います!

JavaScriptのevery関数とは何者か?some関数などと比較して紹介

JavaScriptのevery関数とは、一体どんなものなのでしょうか。

Array.prototype.every()
every() メソッドは、与えられた関数によって実行されるテストに、配列のすべての要素が通るかどうかをテストします。

MDNさんのページによれば、「配列内の全ての要素に対してテストを行う」「配列内の全ての要素に該当すれば、true。そうでない場合はfalseを返す」といった説明がなされています。

わりかしセットで紹介されているのがsome関数。

Array.prototype.some()
some() メソッドは、配列の少なくとも 1 つの要素が、渡された関数によって実施されるテストに通るかどうかをテストします。

こちらは、配列の中で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の関数、まだまだ便利な命令がたくさんありそうですね!これからも発見したら紹介したいと思います!