条件に一致する配列の要素を検索する

配列に対して指定した条件に一致する要素を検索し、要素のインデックスまたは値を取得することができます。ここでは JavaScript で条件に一致する配列の要素を検索する方法について解説します。

(Last modified: 2024-09-04)

条件に一致するインデックスを取得する(findIndexメソッド)
条件に一致する要素の値を取得する(findメソッド)
少なくとも一つの要素が条件に一致するかどうか(someメソッド)
すべての要素が条件に位置するかどうか(everyメソッド)

条件に一致するインデックスを取得する(findIndexメソッド)

Array オブジェクトの findIndex メソッドを使うと、引数に指定したコールバック関数の中で定義した条件式を満たす要素を配列の先頭から検索することができます。書式は次の通りです。

配列名.findIndex( コールバック関数(要素の値) )
配列名.findIndex( コールバック関数(要素の値, 要素のインデックス) )
配列名.findIndex( コールバック関数(要素の値, 要素のインデックス, 配列) )

findIndex メソッドは配列に含まれる要素を先頭から順に取り出しコールバック関数を呼び出します。コールバック関数は、現在取り出されている要素の値、要素のインデックス、そして配列そのものを引数にして呼び出されます。コールバック関数の中では条件式など記述して、関数が戻り値として true が返された時に findIndex メソッドはその要素のインデックスを返します。

次のサンプルをみてください。

let result = [75, 68, 92, 84, 90];

let passIndex = result.findIndex(function(element){
  return element > 85;
});

console.log(passIndex);
>> 2

今回のサンプルではコールバック関数で要素の値が 85 よりも大きかどうかを比較し、 true または false を返しています。 true が返された時のインデクスをメソッドの戻り値として返します。

findIndex メソッドは配列の先頭から順に要素を取り出してコールバック関数を呼び出しますので、配列の中で複数の要素が条件を満たす場合、最初に見つかった要素のインデックスを返します。

なおコールバック関数はアロー関数式を使って次のように記述することもできます。(アロー関数式については「アロー関数式を使って関数を定義する」を参照されてください)。

let result = [75, 68, 92, 84, 90];

let passIndex = result.findIndex(element => element > 85);
console.log(passIndex);
>> 2

条件に一致する要素の値を取得する(findメソッド)

Array オブジェクトの find メソッドを使うと、引数に指定したコールバック関数の中で定義した条件式を満たす要素を配列の先頭から検索することができます。 findIndex メソッドと似ていますが findIndex メソッドは見つかった要素のインデックスを返しますが fine メソッドは見つかった要素の値を返します。書式は次の通りです。

配列名.find( コールバック関数(要素の値) )
配列名.find( コールバック関数(要素の値, 要素のインデックス) )
配列名.find( コールバック関数(要素の値, 要素のインデックス, 配列) )

find メソッドは配列に含まれる要素を先頭から順に取り出しコールバック関数を呼び出します。コールバック関数は、現在取り出されている要素の値、要素のインデックス、そして配列そのものを引数にして呼び出されます。コールバック関数の中では条件式など記述して、関数が戻り値として true が返された時に find メソッドはその要素の値を返します。

次のサンプルをみてください。

let result = [75, 68, 92, 84, 90];

let passValue = result.find(function(element){
  return element > 85;
});

console.log(passValue);
>> 92

今回のサンプルではコールバック関数で要素の値が 85 よりも大きかどうかを比較し、 true または false を返しています。 true が返された時の要素の値をメソッドの戻り値として返します。

find メソッドは配列の先頭から順に要素を取り出してコールバック関数を呼び出しますので、配列の中で複数の要素が条件を満たす場合、最初に見つかった要素の値を返します。

なおコールバック関数はアロー関数式を使って次のように記述することもできます。

let result = [75, 68, 92, 84, 90];

let passValue = result.find(element => element > 85);
console.log(passValue);
>> 92

少なくとも一つの要素が条件に一致するかどうか(someメソッド)

Array オブジェクトの some メソッドを使うと、引数に指定したコールバック関数の中で定義した条件式を満たす要素が配列の中に一つでもあるかどうかを調べる場合に使用します。書式は次の通りです。

配列名.some( コールバック関数(要素の値) )
配列名.some( コールバック関数(要素の値, 要素のインデックス) )
配列名.some( コールバック関数(要素の値, 要素のインデックス, 配列) )

some メソッドは配列に含まれる要素を先頭から順に取り出しコールバック関数を呼び出します。コールバック関数は、現在取り出されている要素の値、要素のインデックス、そして配列そのものを引数にして呼び出されます。コールバック関数の中で記述した条件を満たす要素が一つでもあった場合は true を返します。条件を満たす要素が一つも見つからなかったり、対象の配列が空だった場合は false を返します。

次のサンプルをみてください。

let result = [75, 68, 92, 84, 90];

let checkOver85 = result.some(function(element){
  return element > 85;
});

console.log(checkOver85);
>> true

let checkUnder60 = result.some(function(element){
  return element < 60;
});

console.log(checkUnder60);
>> false

今回のサンプルでは一つ目のコールバック関数で要素の値が 85 よりも大きかどうかを比較し、条件を満たす要素が見つかったので戻り値として true を返しています。また二つ目のコールバック関数では要素の値が 60 よりも小さいかどうかを比較し、条件を満たす要素が一つもみあたらなかったので false を返しています。

なおコールバック関数はアロー関数式を使って次のように記述することもできます。

let result = [75, 68, 92, 84, 90];

let checkOver85 = result.some(element => element > 85);
console.log(checkOver85);
>> true

let checkUnder60 = result.some(element => element < 60);
console.log(checkUnder60);
>> false

すべての要素が条件に位置するかどうか(everyメソッド)

Array オブジェクトの every メソッドを使うと、引数に指定したコールバック関数の中で定義した条件式を配列のすべての要素が満たすかどうかを調べる場合に使用します。書式は次の通りです。

配列名.every( コールバック関数(要素の値) )
配列名.every( コールバック関数(要素の値, 要素のインデックス) )
配列名.every( コールバック関数(要素の値, 要素のインデックス, 配列) )

every メソッドは配列に含まれる要素を先頭から順に取り出しコールバック関数を呼び出します。コールバック関数は、現在取り出されている要素の値、要素のインデックス、そして配列そのものを引数にして呼び出されます。コールバック関数の中で記述した条件をすべての要素が満たす場合は true を返します。条件を満たさない要素が一つでもあった場合は false を返します。なお配列が空だった場合は true を返します。

次のサンプルをみてください。

let result = [75, 68, 92, 84, 90];

let checkOver60 = result.every(function(element){
  return element > 60;
});

console.log(checkOver60);
>> true

let checkUnder90 = result.every(function(element){
  return element < 90;
});

console.log(checkUnder90);
>> false

今回のサンプルでは一つ目のコールバック関数で要素の値が 60 よりも大きかどうかを比較し、すべての要素が条件を満たしたので戻り値として true を返しています。また二つ目のコールバック関数では要素の値が 90 よりも小さいかどうかを比較し、条件を満たさない要素が少なくとも一つ見つかったので false を返しています。

なおコールバック関数はアロー関数式を使って次のように記述することもできます。

let result = [75, 68, 92, 84, 90];

let checkOver85 = result.every(element => element > 60);
console.log(checkOver85);
>> true

let checkUnder60 = result.every(element => element < 90);
console.log(checkUnder60);
>> false

-- --

JavaScript で条件に一致する配列の要素を検索する方法について解説しました。

( Written by Tatsuo Ikura )

著者 / TATSUO IKURA

これから IT 関連の知識を学ばれる方を対象に、色々な言語でのプログラミング方法や関連する技術、開発環境構築などに関する解説サイトを運営しています。