💡 記事の下にエディタを用意しています。壊してもOK！
更新日: 2025年3月1日
JavaScriptのfilterの使い方｜配列を条件で抽出
📌
結論
filter で条件に合う要素だけを抽出できます
📝 実際のコードはこちら
const filtered = [1, 2, 3, 4, 5].filter(n => n >= 3);
console.log(filtered); // [3, 4, 5]filterの特徴
| 特徴 | 説明 |
|---|---|
| 非破壊 | 元の配列は変更しない |
| コールバック | true を返した要素だけ残る |
| mapとの違い | mapは変換、filterは抽出 |
実務での活用
検索、絞り込み、条件フィルタリングなど、あらゆる場面で使います。APIから取得したデータを条件で絞り込むのは日常的な操作です。まとめ
・filter は条件に合う要素だけの新配列を作る
・コールバックが true の要素だけが残る
・元の配列は変更されない
演習で試してみよう
filterで3以上の数だけ抽出してみましょう。🧪 ここで試せます ─ 壊しても大丈夫！
下のエディタで実際にコードを書いて、すぐにプレビューで確認できます。何度でもやり直せるので、思い切って色々試してみてください。
■ 演習
配列[1,2,3,4,5]から3以上の数だけをfilterで抽出し、console.logで出力してください。
詰まったらヒント
arr.filter(n => n >= 3)