array.find()

アレイ・ファインド（組み込みオブジェクト）

意味条件に合う要素を検索

array.find()とは？

`array.find()`メソッドは、指定されたテスト関数を満たす最初の要素の値を返します。

array.find()の具体的な使い方

条件を満たす最初の要素を見つける例

const fruits = [
  { name: 'りんご', color: 'red' },
  { name: 'バナナ', color: 'yellow' },
  { name: 'ぶどう', color: 'purple' },
  { name: 'いちご', color: 'red' }
];

const redFruit = fruits.find(fruit => fruit.color === 'red');
console.log('最初の赤い果物:', redFruit);

const greenFruit = fruits.find(fruit => fruit.color === 'green');
console.log('緑の果物:', greenFruit);

👇出力結果

最初の赤い果物: { name: 'りんご', color: 'red' }
緑の果物: undefined

この例では、fruitsという果物オブジェクトの配列に対してfind()メソッドを使用しています。色が'red'の最初の果物を検索し、見つかった要素を表示します。また、存在しない色'green'の果物も検索しています。条件を満たす要素がない場合はundefinedが返されます。

array.find()に関するよくある質問

Q. 条件を満たす要素がない場合は？

A. find()メソッドは、条件を満たす要素が見つからない場合はundefinedを返します。findIndex()の場合は-1を返します。

Q. find()とfilter()の違いは？

A. find()は条件を満たす最初の要素のみを返しますが、filter()は条件を満たすすべての要素を含む新しい配列を返します。

Q. find()は配列を変更する？

A. いいえ、find()メソッドは元の配列を変更しません。条件を満たす要素を見つけて返すだけです。

JavaScriptを勉強するのにおすすめな問題集アプリの紹介

楽しくプログラミングを学ぶことで、プログラミングの理解度が深まります。『JavaScript問題集』は、楽しくJavaScriptを学ぶのに最適なアプリです。AIが出題する問題に答えていくことで、自然とJavaScriptの理解度が深まります。

AppStoreからダウンロード：https://apps.apple.com/jp/app/id6737941570

JavaScriptのarray.find()についても学べる書籍の紹介

「プログラミング単語帳」を使って、プログラミングの単語を英単語のように学習してみませんか？
プログラミング単語帳には、JavaScriptのarray.find()やObject.create()、string.match()、array.filter()、などのような実務でよく使われる単語が数百以上収録されています。
この書籍には、プログラミングの単語の意味や読み方、単語の使い方がわかる例文などが掲載されており、いつでもどこでもプログラミングの学習ができます。

よく使われる単語にだけ絞って学習することができるので、効率的にプログラミングが学習できます。