javascriptにて配列を検索する
１．JavaScriptにて配列を検索する
JavaScriptにて配列の検索を行う場合、いくつかのメソッドが存在していますのでその一部についての使用例を記載します。
・JavaScriptのindexOfメソッドを使用して配列を検索する
JavaScriptのindexOfメソッドは、対象の配列の最初から引数に指定した文字列を検索し、指定された値が最初に見つかった添え字を返します。見つからなかった場合には、-1を返します。
indexOfメソッドの記述方法は以下になります。
配列.indexOf(検索したい文字列[, 検索開始位置])
使用例は以下になります。
const arrData = ['白', '黒', '三毛', '茶トラ', '黒', '白'];
const searchData = '黒';
let index1 = arrData.indexOf(searchData); // 1
let index2 = arrData.indexOf(searchData, 2); // 4
・JavaScriptのlastIndexOfメソッドを使用して配列を検索する
JavaScriptのlastIndexOfメソッドは、対象の配列の最後から引数に指定した文字列を検索し、指定された値が最初に見つかった添え字を返します。見つからなかった場合には、-1を返します。
lastIndexOfメソッドの記述方法は以下になります。
配列.lastIndexOf(検索したい文字列[, 検索開始位置])
使用例は以下になります。
const arrData = ['白', '黒', '三毛', '茶トラ', '黒', '白'];
const searchData = '黒';
let index1 = arrData.lastIndexOf(searchData); // 4
let index2 = arrData.lastIndexOf(searchData, 3); // 1
・JavaScriptのfindIndexメソッドを使用して配列を検索する
JavaScriptのfindIndexメソッドは、対象の配列に提供されたテスト関数を満たす配列内の最初の添え字を返します。見つからなかった場合には、-1を返します。
findIndexメソッドの記述方法は以下になります。
配列.findIndex(コールバック関数(配列内で現在処理されている要素[, 配列内で現在処理されている要素の添字[, findを呼び出した元の配列]])[, thisの値])
使用例は以下になります。
const arrData = [3, 11, 8, 10, 15, 7];
const isNumber = (element) => element > 10;
let index = arrData.findIndex(isNumber); // 1
・JavaScriptのfindメソッドを使用して配列を検索する
JavaScriptのfindメソッドは、対象の配列に提供されたテスト関数を満たす配列内の最初の要素の値を返します。見つからなかった場合には、undefinedを返します。
findメソッドの記述方法は以下になります。
配列.find(コールバック関数(配列内で現在処理されている要素[, 配列内で現在処理されている要素の添字[, findを呼び出した元の配列]])[, thisの値])
使用例は以下になります。
const arrData = [3, 11, 8, 10, 15, 7];
const isNumber = (element) => element > 10;
let number = arrData.find(isNumber); // 11
・JavaScriptのfilterメソッドを使用して配列を検索する
JavaScriptのfilterメソッドは、対象の配列に提供されたテスト関数を満たす配列内の全ての値を返します。見つからなかった場合には、空の配列を返します。
filterメソッドの記述方法は以下になります。
配列.filter(コールバック関数(配列内で現在処理されている要素[, 配列内で現在処理されている要素の添字[, findを呼び出した元の配列]])[, thisの値])
使用例は以下になります。
const arrData = [3, 11, 8, 10, 15, 7];
const isNumber = (element) => element > 10;
let result = arrData.filter(isNumber); // [11, 15]
２．最後に
JavaScriptにて配列の検索を行う場合、単純な検索の場合にはindexOf、lastIndexOfメソッドなどを使用するでいいかもしれませんが、この他にfindIndex、find、filterメソッドはコールバック関数を使用するため、複雑な検索にも対応できます。また、関数を使わずに条件分岐で自身で処理を作成することも可能ですので使いやすいものを使ってください。