こんにちは。環境の影響を受けやすい、根っからのミーハーなフロントエンドエンジニア・ザワです。「ミーハー」という言葉は死語なのでしょうか。
さて、今回のArrayシリーズは、そんなミーハーな私にはたまらないメソッドであるArray.prototype.everyをご紹介しましょう。
「every」と聞くと某ニュース番組を連想してしまいがちですが、「すべての」という意味ですよね。どういうメソッドなのか、この時点ですでに想像に容易いのではないでしょうか。
それではさっそく進めていきたいと思います。
※ここからの説明は個人的に調べて解釈したざっくりとした説明になります。詳しく知りたい方はこちらへどうぞ
Array.prototype.every()メソッドとは
配列の各要素に対してテストを行い、すべて通った場合にtrueを返します。
テストが失敗した時点でfalseを返して、以降の要素に対してのテストは行われません。
クイズ番組で回答を1人ずつ確認していき、全員の回答が一致すればクリア、という問題と似ています。一致してない回答があった時点でクリアならず、となるわけですね。
実装例文
さっそく例文です。
See the Pen
Array.prototype.every() sample1 by Zawa (@sowork)
on CodePen.
結果としては、コンソールに「全員ダンディー」と表示されます。
上記の例では、男性3人にそれぞれ年齢を聞いていき、みなさん40歳以上だったので、ダンディー認定したという日常を切り取っています。年齢だけでダンディーとするのは浅はかですが……。
everyメソッドにはコールバック関数を引数として渡しています。
コールバック関数は配列の各要素に対して行われ、3つの引数を取ることができます。第1引数に現在の要素、第2引数にインデックス、第3引数に呼び出した配列……この例文だとageList変数に格納されている配列ですね。
everyメソッドにはコールバック関数のほかに、コールバック関数内でthisとして使用されるオブジェクトを第二引数として取ります。
テスト失敗時
次に、テストに失敗したときに以降の要素はテストされないか、実際に確認してみましょう。
See the Pen
Array.prototype.every() sample2 by Zawa (@sowork)
on CodePen.
コールバック関数にconsole.logを仕込んでみました。
コンソールを見てみると、「ダンディズム」と2回だけ表示され、3つめの要素はテストされていないことがわかります。
終わりに
今回取り上げたArray.prototype.everyメソッド。ECMAScript5.1から標準化されていましたが、その存在を私は今回はじめて知りました。地道に勉強すれば知識が広がるものだな、と実感しています。
それでは良い制作ライフを！ ザワでした。
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
