配列.includes() / indexOf() / lastIndexOf() 対応: ES2016（ECMAScript 2016）

配列に特定の値が含まれているかを確認したり、値の位置を検索するメソッドです。『includes()』は真偽値を、『indexOf()』はインデックスを返します。

構文

// 値が含まれているかを判定します。
var result = 配列.includes(検索する値, 開始位置);

// 値が最初に見つかった位置を返します。
var index = 配列.indexOf(検索する値, 開始位置);

// 値が最後に見つかった位置を返します。
var index = 配列.lastIndexOf(検索する値, 開始位置);

メソッド一覧

メソッド	概要
includes(値, 開始位置)	配列に指定した値が含まれていれば『true』、含まれていなければ『false』を返します。開始位置は省略可能です。
indexOf(値, 開始位置)	指定した値が最初に見つかったインデックスを返します。見つからない場合は『-1』を返します。
lastIndexOf(値, 開始位置)	指定した値が最後に見つかったインデックスを返します。見つからない場合は『-1』を返します。

サンプルコード

var colors = ["赤", "青", "緑", "青", "黄"];

// 値が含まれているかを判定します。
console.log(colors.includes("青")); // 『true』と出力されます。
console.log(colors.includes("紫")); // 『false』と出力されます。

// 最初に見つかった位置を返します。
console.log(colors.indexOf("青")); // 『1』と出力されます。
console.log(colors.indexOf("紫")); // 『-1』と出力されます。見つからない場合です。

// 最後に見つかった位置を返します。
console.log(colors.lastIndexOf("青")); // 『3』と出力されます。

// 開始位置を指定して検索します。
console.log(colors.indexOf("青", 2)); // 『3』と出力されます。インデックス2以降を検索します。

// NaNの判定で違いがあります。
var arr = [1, NaN, 3];
console.log(arr.includes(NaN)); // 『true』と出力されます。
console.log(arr.indexOf(NaN)); // 『-1』と出力されます。indexOfではNaNを検出できません。

概要

『配列.includes()』は値が存在するかどうかだけを知りたい場合に最も適したメソッドです。if文の条件として直接使えるため、従来の『配列.indexOf() !== -1』と比べてコードが読みやすくなります。ES2016で追加された比較的新しいメソッドで、『NaN』を正しく判定できるという利点もあります。

『配列.indexOf()』はES5から使用できる歴史のあるメソッドで、値の位置を知りたい場合に使用します。『NaN === NaN』がJavaScriptでは『false』になるため、『配列.indexOf()』では『NaN』を検出できません。『NaN』の存在確認には『配列.includes()』を使用してください。

これらのメソッドは『===』と同様の厳密な比較を行うため、型が異なる場合は一致しません。オブジェクトや配列は参照が同じ場合のみ一致します。条件式を使った高度な検索には『配列.find() / 配列.findIndex()』を使用してください。