JavaScript Array.find()とfindIndex() - 要素の検索

find()とfindIndex()を理解する

Array.find()はテスト関数を満たす最初の要素を返します。Array.findIndex()はその要素のインデックスを返します。どちらもショートサーキットします — 一致が見つかるとすぐに反復を停止します。

構文

const element = array.find((el, index, array) => condition);
const idx = array.findIndex((el, index, array) => condition);

基本例

const users = [
  { id: 1, name: "Alice" },
  { id: 2, name: "Bob" },
  { id: 3, name: "Carol" }
];

const bob = users.find(u => u.id === 2);
// bob: { id: 2, name: "Bob" }

const bobIndex = users.findIndex(u => u.id === 2);
// bobIndex: 1

find() vs filter()

メソッド	戻り値	早期停止？	使い分け
find()	単一要素またはundefined	はい	1つの結果が必要
filter()	すべてのマッチの配列	いいえ	すべての結果が必要

ES2023: findLast()とfindLastIndex()

配列の末尾から検索：

const nums = [1, 3, 5, 2, 4, 6];
nums.findLast(n => n > 3);      // 6
nums.findLastIndex(n => n > 3);  // 5

時系列データで最新のアイテムを見つけるのに便利です。