JavaScript配列の値検索方法
JavaScriptで配列に特定の値が含まれるかチェックする方法
JavaScriptでは、配列に特定の値が含まれているかどうかを調べるために、主に次の2つの方法が使用されます。
- indexOf()メソッド
配列内で指定した値が見つかった場合にそのインデックスを、見つからなかった場合に-1を返します。 - includes()メソッド
配列に指定した値が含まれている場合にtrueを、含まれていない場合にfalseを返します。
コード例
const numbers = [1, 2, 3, 4, 5];
// includes()メソッドの使用
const includesThree = numbers.includes(3); // true
const includesSix = numbers.includes(6); // false
// indexOf()メソッドの使用
const indexThree = numbers.indexOf(3); // 2
const indexSeven = numbers.indexOf(7); // -1
説明
indexOf()メソッド
- 値が存在するかどうかだけでなく、そのインデックスも知りたい場合に使用します。
- 値が存在しない場合は-1が返されるため、注意が必要です。
includes()メソッド
- シンプルで直接的な方法です。
- 値が存在するかどうかのみ知りたい場合に適しています。
どちらを使うべきか
一般的には、単純に値の存在を確認したい場合はincludes()
メソッドが好まれます。値のインデックスも必要な場合はindexOf()
メソッドを使用します。
備考
indexOf()
メソッドは、それ以前から存在するため、より広くサポートされています。includes()
メソッドは、ES6から導入されたため、古いブラウザではサポートされていない可能性があります。
アルゴリズム的な観点
includes()
メソッドとindexOf()
メソッドは、内部的には似たようなアルゴリズムを使用していると考えられます。配列の要素を順番に調べて、指定した値と一致するかどうかを比較します。
注意
実際のアルゴリズムの実装はブラウザによって異なる可能性があります。
JavaScriptで配列に特定の値が含まれるかどうかをチェックするには、includes()
メソッドまたはindexOf()
メソッドを使用します。問題に応じて適切な方法を選択してください。
const numbers = [1, 2, 3, 4, 5];
// 値が含まれている場合
console.log(numbers.includes(3)); // true
// 値が含まれていない場合
console.log(numbers.includes(6)); // false
配列内で指定した値が見つかった場合のインデックスを返します。見つからない場合は-1を返します。
const numbers = [1, 2, 3, 4, 5];
// 値が見つかった場合
console.log(numbers.indexOf(3)); // 2
// 値が見つからない場合
console.log(numbers.indexOf(6)); // -1
find()メソッド
配列から条件に一致する最初の要素を返します。条件に一致する要素がない場合はundefinedを返します。
const numbers = [1, 2, 3, 4, 5];
// 条件に一致する要素がある場合
const foundNumber = numbers.find(number => number > 3);
console.log(foundNumber); // 4
// 条件に一致する要素がない場合
const notFoundNumber = numbers.find(number => number > 5);
console.log(notFoundNumber); // undefined
filter()メソッド
配列から条件に一致するすべての要素を新しい配列として返します。
const numbers = [1, 2, 3, 4, 5];
// 条件に一致する要素がある場合
const filteredNumbers = numbers.filter(number => number > 2);
console.log(filteredNumbers); // [3, 4, 5]
// 条件に一致する要素がない場合
const emptyArray = numbers.filter(number => number > 5);
console.log(emptyArray); // []
some()メソッド
配列の少なくとも1つの要素が条件を満たすかどうかを真偽値で返します。
const numbers = [1, 2, 3, 4, 5];
// 条件を満たす要素がある場合
console.log(numbers.some(number => number > 3)); // true
// 条件を満たす要素がない場合
console.log(numbers.some(number => number > 5)); // false
every()メソッド
const numbers = [1, 2, 3, 4, 5];
// すべての要素が条件を満たす場合
console.log(numbers.every(number => number > 0)); // true
// すべての要素が条件を満たさない場合
console.log(numbers.every(number => number > 2)); // false
JavaScriptにおける配列の値検索の代替方法
従来の方法: forループ
最も基本的な方法は、forループを使用して配列の要素を一つずつチェックすることです。
const numbers = [1, 2, 3, 4, 5];
const target = 3;
let found = false;
for (let i = 0; i < numbers.length; i++) {
if (numbers[i] === target) {
found = true;
break;
}
}
console.log(found); // true
注意
性能面では、他のメソッドに比べて効率が悪いため、大きな配列を扱う場合は避けるべきです。
インデックスを取得する
- lastIndexOf(): 配列内で指定した値の最後のインデックスを返します。見つからない場合は -1 を返します。
const numbers = [1, 2, 3, 4, 3, 5];
console.log(numbers.indexOf(3)); // 2
console.log(numbers.lastIndexOf(3)); // 4
条件に一致する要素を取得する
- findIndex(): 配列から条件に一致する最初の要素のインデックスを返します。条件に一致する要素がない場合は -1 を返します。
const numbers = [1, 2, 3, 4, 5];
const foundNumber = numbers.find(number => number > 3);
console.log(foundNumber); // 4
const foundIndex = numbers.findIndex(number => number > 3);
console.log(foundIndex); // 3
条件に一致する要素の有無をチェックする
const numbers = [1, 2, 3, 4, 5];
console.log(numbers.some(number => number > 3)); // true
console.log(numbers.every(number => number > 0)); // true
性能考慮
- find(), findIndex(), some(), every(): 関数をコールバックとして使用するため、オーバーヘッドがあります。大きな配列の場合は、パフォーマンスに影響を与える可能性があります。
- indexOf(): includes() と同等の性能ですが、インデックスも取得できます。
- includes(): 一般的に最も高速な方法です。
javascript arrays algorithm