[TypeScript] 配列の条件に一致する最初の要素を取得するfind関数

はじめに

この記事では、TypeScriptのfind をまとめております。

参考資料

結論

配列の各要素に対して指定された条件に一致する最初の要素を返すメソッド

※要素が存在しない場合はundefinedを返します。
しかし、文末に**?? 任意の値**を記述すると任意の値を返す事が出来る

const hoge = list.find((各要素) => 条件式);

メリット

1. for ループなどを使用する場合よりも、シンプルなコードを書くことができます
2. 要素が見つからなかった場合は undefined を返すため、エラー処理が簡単に行えます。
3. 配列内の要素が多数ある場合でも、検索が高速に行えます。

1. 条件を満たす

// 数字の配列
const numbers = [1, 2, 3, 4, 5];
// 2より大きい値を取得する(最初にヒットした値を取得する)
const result = numbers.find((i) => i > 2);

// 期待値： 3
console.log(result);

実行結果を確認する

3

2. 条件を満たさない

// 数字の配列
const numbers = [1, 2, 3, 4, 5];
// 10より大きい値を取得する
const result = numbers.find((i) => i > 10);

// 期待値： undefined
console.log(result);

実行結果を確認する

undefined

3. 条件を満たさないかつ undefined を返さない

// 数字の配列
const numbers = [1, 2, 3, 4, 5];
// 10より大きい値を取得する
const result = numbers.find((i) => i > 10) ?? false;

// 期待値： false
console.log(result);

実行結果を確認する

false