array.filter()

アレイ・フィルター（組み込みオブジェクト）

意味条件に合う要素を取得

array.filter()とは？

`array.filter()`メソッドは、指定された関数にテストを通過したすべての要素からなる新しい配列を生成します。

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

配列から偶数を抽出する例

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers);

👇出力結果

[2, 4, 6, 8, 10]

この例では、1から10までの数字の配列から偶数のみを抽出しています。filter()メソッドは、各要素に対して条件（num % 2 === 0）をチェックし、その条件を満たす要素のみを新しい配列に含めます。

オブジェクト配列から特定の条件を満たす要素を抽出する例

const products = [
  { name: 'Apple', price: 100 },
  { name: 'Banana', price: 80 },
  { name: 'Orange', price: 120 },
  { name: 'Mango', price: 150 }
];

const expensiveProducts = products.filter(product => product.price > 100);
console.log(expensiveProducts);

👇出力結果

[{ name: 'Orange', price: 120 }, { name: 'Mango', price: 150 }]

この例では、商品オブジェクトの配列から価格が100を超える商品のみを抽出しています。filter()メソッドは、各オブジェクトに対して条件（product.price > 100）をチェックし、その条件を満たすオブジェクトのみを新しい配列に含めます。

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

Q. filter()は元の配列を変更しますか？

A. いいえ、filter()は新しい配列を返し、元の配列は変更しません。

Q. filter()の引数は何ですか？

A. filter()の引数はコールバック関数で、各要素に対して真偽値を返す必要があります。

Q. 空の配列にfilter()を使うとどうなりますか？

A. 空の配列にfilter()を使用すると、新しい空の配列が返されます。

array.filter()が学べる書籍の紹介

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

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