【JavaScript】配列の値をfindで簡単に検索する方法

はじめに

JavaScriptの世界では、配列はなくてはならない存在です。特定の要素を配列から見つけ出すシーンも多くありますよね。今回は、シンプルに配列からデータを検索する方法からオブジェクトの配列を検索する方法を紹介しましょう。

「indexOf」メソッドと「find」メソッドを使った検索

単純に配列の内容を検索する

最も直感的かつシンプルな方法として、「indexOf」メソッドを使うと指定した要素が配列内に存在するインデックス(位置)を返します。

下記のコードでは、「array」配列から「30」を探し、そのインデックス番号「2」が出力されます。

let array = [10, 20, 30, 40, 50];
let index = array.indexOf(30);

console.log(index); // 出力：2

オブジェクトの配列を検索する

もう少し複雑なケースとして、オブジェクトの配列を検索する場合を見てみましょう。この場合は「find」メソッドを使用すると良いでしょう。

let array = [{name: '二郎', age: 22}, {name: '太郎', age: 24}, {name: '三郎', age: 21}];
let person = array.find(obj => obj.name === '太郎');

console.log(person); // 出力：{ name: '太郎', age: 24 }

まとめ

今回は、JavaScriptで配列の内容を検索する具体的な方法について解説しました。データを画面上で切り替えるなど、使用するシーンは多々あります。ぜひ、利用してみてください。