JavaScript - 配列の要素を検索する

Array.prototype.indexOf()

indexOf() メソッドは引数に与えられた内容と同じ内容を持つ配列要素の内、最初のものの添字を返します。存在しない場合は -1 を返します。indexOf の構文は以下のとおりです。

arr.indexOf(searchElement[, fromIndex])

searchElement

検索する配列要素です。

fromIndex

検索を始める添字です。もしこの添字が配列の長さ以上の場合は -1 が返され、配列は検索されません。負の数の場合、これは配列の末尾からのオフセットとみなされます。なお、この添字が負の数であっても、配列は前から後ろに検索されることに注意してください。指定された添字が 0 であれば、配列全体が検索されます。既定値は 0 (配列全体を検索) です。このパラメータは、オプションであるため省略可能です。

indexOf の返り値は、見つかった配列要素の最初の添字です。見つからなかった場合は -1 です。

var array = [2, 9, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

indexOf は、ある要素が見つかった時点で検索を中止するため、注意が必要です。

var array = [2, 9, 9];
array.indexOf(9);     // 1

ある要素の存在をすべて見つけるためには、以下のように記述します。

var indices = [];
var array = ['a', 'b', 'a', 'c', 'a', 'd'];
var element = 'a';
var idx = array.indexOf(element);
while (idx != -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices); // [0, 2, 4]

サポートブラウザ

IE	Edge	Firefox	Chrome	Safari	Opera	iOS Safari	Android
9	12	1.5	1	◯	◯	◯	37
◯：Support　✕：Not Support　？：未定義　ｎ：以降の Version で Support

String.prototype.lastIndexOf()

lastIndexOf() メソッドは、呼び出す String オブジェクト中で fromIndex から逆方向に検索し、指定された値が最後に現れるインデックスを返します。値が見つけられない場合 -1 を返します。lastIndexOf の構文は以下のとおりです。

str.lastIndexOf(searchValue[, fromIndex])

searchValue

検索する値を表す文字列です。searchValue が空文字列だった場合、fromIndex が返されます。

fromIndex

文字列内で検索を始める位置です。デフォルト値は +Infinity です。fromIndex >= str.length の場合、文字列全体が検索対象になります。fromIndex < 0 の場合 0 の場合と同じ動作をします。このパラメータは、オプションであるため省略可能です。

lastIndexOf の返り値は、指定された値が最後に現れるインデックスを返します。見つからなかった場合は -1 です。

'canal'.lastIndexOf('a');     // 3
'canal'.lastIndexOf('a', 2);  // 1
'canal'.lastIndexOf('a', 0);  // -1
'canal'.lastIndexOf('x');     // -1
'canal'.lastIndexOf('c', -5); // 0
'canal'.lastIndexOf('c', 0);  // 0
'canal'.lastIndexOf('');      // 5
'canal'.lastIndexOf('', 2);   // 2

サポートブラウザ

IE	Edge	Firefox	Chrome	Safari	Opera	iOS Safari	Android
6	12	1	1	◯	◯	◯	1
◯：Support　✕：Not Support　？：未定義　ｎ：以降の Version で Support

Array.prototype.find()

find() メソッドは、提供されたテスト関数を満たす配列内の最初の要素の値を返します。find の構文は以下のとおりです。

arr.find(callback(element[, index[, array]])[, thisArg])

callback

配列内の各要素に対して実行する関数で、次の 3 つの引数を取ります。

• element: 配列内で現在処理されている要素です。
• index: 配列内で現在処理されている要素の添字 (位置) です。(オプション)
• array: find を呼び出した元の配列です。(オプション)

thisArg

callback 内で this として使われるオブジェクトです。このパラメータは、オプションであるため省略可能です。

find の返り値は、配列の中で提供されたテスト関数を満足する最初の要素の値です。見つからなかった場合は undefined を返します。

const array1 = [5, 12, 8, 130, 44];

const found = array1.find(element => element > 10);

console.log(found); // 12

サポートブラウザ

IE	Edge	Firefox	Chrome	Safari	Opera	iOS Safari	Android
✕	12	25	45	8	32	8	◯
◯：Support　✕：Not Support　？：未定義　ｎ：以降の Version で Support

Array.prototype.findIndex()

findIndex() メソッドは、配列内の要素が指定されたテスト関数を満たす場合、配列内のインデックスを返します。そうでない場合は -1 を返します。findIndex の構文は以下のとおりです。

arr.findIndex(callback[, thisArg])

callback

配列内の各要素に対して実行する関数で、次の 3 つの引数を取ります。

• element: 配列内で現在処理されている要素です。
• index: 配列内で現在処理されている要素の添字 (位置) です。(オプション)
• array: findIndex を呼び出した元の配列です。(オプション)

thisArg

callback 内で this として使われるオブジェクトです。このパラメータは、オプションであるため省略可能です。

find の返り値は、テストを満たした配列の要素のインデックスを返します。満たさなければ -1を返します。

const array1 = [5, 12, 8, 130, 44];

const isLargeNumber = (element) => element > 13;

console.log(array1.findIndex(isLargeNumber)); // 3

サポートブラウザ

IE	Edge	Firefox	Chrome	Safari	Opera	iOS Safari	Android
✕	12	25	45	8	32	8	◯
◯：Support　✕：Not Support　？：未定義　ｎ：以降の Version で Support

関連記事

• JavaScript 入門

• 配列を定義する
• 配列の要素を追加する
• 配列の要素を削除する
• 配列の要素を置換する
• 配列の要素を結合する
• 配列を複製する
• 配列を連結する
• 配列を並び替える