配列内の要素の存在確認にはArray.includes()メソッドが便利（ES2016新機能）

3171 ワード
es2016 es7 JavaScript es2015 array JavaScript テキストリンク

2016/06/17、JavaScriptの仕様「ECMAScript」のECMAScript 2016（※）がリリースされました。ES2016で追加された機能は２つです。

  • Exponentiation(**) Operator
  • Array.prototype.includes()メソッド

本エントリーでは、Array.prototype.includes()メソッドについて解説します。「Exponentiation Operator」についてはこちらの記事で解説します。
「べき乗をするならMath.pow()よりもExponentiation Operatorが手軽（ES2016新機能）」

※ 言語仕様書：「ECMAScript® 2016 Language Specification」

Array.prototype.includes()メソッドは配列内の値検索のためのメソッド

Array.prototype.includes()メソッドは、配列内にある要素が含まれているかどうかを調べるためのメソッドです。

次のような配列を例にして説明します。

var array = [1, 2, 3, 4, 5];

Array.prototype.includes()メソッドを使って、3という要素が含まれているかどうかを調べるには次のように行います。

// 3が含まれているかどうか
array.includes(3);

arrayの中には3が含まれているので、trueが返ります。

▲ Google Chromeでの実行結果

では、6が含まれているかどうかを調べるとどうなるのでしょうか？

// 6が含まれているかどうか
array.includes(6);

arrayの中には6が含まれていないので、falseが返ります。

▲ Google Chromeでの実行結果

このように、Array.prototype.includes()メソッドは配列内の値検索を楽にするメソッドです。

対応ブラウザは？

2018/02/06時点では、IE 11を除く全主要ブラウザで対応しています。

参考：ECMAScript Next compatibility table

IE 11でも対応する必要がある場合は、core-jsなどのポリフィルを使いましょう。