JavaScriptのfindLast・条件を指定して最後の要素を取得!

JavaScriptで配列の末尾から検索し、最初に条件に一致する要素を取得するfindLastメソッドについて書いています。
findLastメソッドは、配列を逆順に検索し、指定されたテスト関数を渡して最初にtrueを返す要素の値を返します。

実際に動くサンプルを使って、以下の操作を解説します。

・`findLast`メソッドの基本的な使い方
・コールバック関数の引数
・`findLast`メソッドを使うメリット

findLastメソッドの基本的な使い方

findLastメソッドは、配列の末尾から検索し、最初に条件に一致する要素の値を返します。
基本的な構文は以下のとおりです。

array.findLast(callback(element[, index[, array]])[, thisArg])
  • callback: 各要素に対して実行するテスト関数。
    • element: 現在処理されている要素。
    • index: 現在処理されている要素のインデックス(省略可能)。
    • array: findLastが呼び出された配列(省略可能)。
  • thisArg: callback内でthisとして使用する値(省略可能)。

配列から条件に一致する最後の要素を取得する

条件に合う最後の要素を取得するサンプルです。

const numbers = [1, 5, 10, 15, 20, 25, 5, 9];
const lastGreaterThan10 = numbers.findLast(element => element > 10);

console.log(lastGreaterThan10); // 結果:25

最初に数値のnumbers配列を作っています。
次の行でfindLastを使って、配列要素から条件に合う最後の要素を取得しています。

numbers配列の末尾から検索し、「10」より大きい要素を検索しています。
最初に条件に一致する要素は「25」なので、「25」が返されます。

条件に一致する要素がない場合

条件に一致する要素がない場合、findLastメソッドはundefinedを返します。

const numbers = [1, 5, 10, 15, 20];
const lastGreaterThan100 = numbers.findLast(element => element > 100);

console.log(lastGreaterThan100); // 結果:undefined

この例では、100より大きい要素は存在しないため、undefinedが返されます。

コールバック関数の引数

findLastメソッドに渡すコールバック関数は、3つの引数を受け取ることができます。

  • element: 現在処理されている要素。
  • index: 現在処理されている要素のインデックス。
  • array: findLastが呼び出された配列。

これらの引数を使うことで、より複雑な条件で要素を検索することができます。

const numbers = [1, 5, 10, 15, 20, 25, 50];
const lastMultipleOf5 = numbers.findLast((element, index, array) => {
  return element % 5 === 0 && index < array.length - 1; // 5の倍数かつ最後の要素ではない
});

console.log(lastMultipleOf5); // 結果:25

findLastのコールバック関数に条件を指定して、関数の中で、5の倍数で最後の要素でないものを判定しています。
結果として「25」が返ってきます。

findLastメソッドを使うメリット

findLastメソッドを使う主なメリットは以下のとおりです。

  • 配列の末尾から効率的に検索: 配列の末尾から検索するため、条件に一致する最後の要素を効率的に取得できます。
  • 柔軟な条件指定: コールバック関数を使うことで、複雑な条件を指定して要素を検索できます。
  • コードの可読性向上: forループなどを使うよりも、簡潔なコードで条件に一致する要素を取得できます。

JavaScriptのfindLastメソッドの使い方まとめ

今回はJavaScriptのfindLastメソッドの使い方について解説しました。
記事の内容をまとめます。

・`findLast`メソッドは、配列の末尾から検索し、最初に条件に一致する要素の値を返す。
・コールバック関数を使って、複雑な条件を指定できる。
・条件に一致する要素がない場合は`undefined`を返す。

コメント