- DAY 7:filter・find 前半 ― 「必要なものだけを取り出す」感覚を身につける
- filter()とは何か ― 「条件に合うものだけを残す」メソッド
- filter()の基本構文とテンプレート
- データの絞り込み:具体例で感覚をつかむ
- 削除処理としてのfilter ― 「残したいものだけを残す」
- 検索処理としてのfilter ― 「条件に合うものだけを一覧にする」
- find()への橋渡し ― 「1件だけ欲しいとき」はどうするか
- DAY 7:filter・find 前半のまとめ
- DAY 7:filter・find 中盤 ― 「filterで一覧」「findで1件」をはっきり区別する
- filter()の復習と「削除処理・検索処理」の整理
- find()とは何か ― 「条件に合う最初の1件」を取り出す
- ID検索としてのfind ― オブジェクト配列との組み合わせ
- 検索処理の設計:filterで一覧、findで詳細
- セキュリティ・安全性の視点から見たfilter・find
- DAY 7:filter・find 中盤のまとめ
- DAY 7:filter・find 後半 ― Reactの「削除・検索・詳細表示」を支える実践パターン
- filterで「削除処理」をReactの状態管理と結びつける
- filterで「検索処理」をUIと結びつける
- findで「ID検索」を詳細表示と結びつける
- セキュリティ・安全性の視点から見たfilter・find+React
- DAY 7:filter・find 後半のまとめ
- DAY 7:filter・find ミニ課題 ― 商品検索プログラムを作る
- 商品データをオブジェクト配列で用意する
- キーワード検索:filter()で「一覧を絞り込む」
- ID検索:find()で「1件だけ取り出す」
- ミニ課題の完成形:キーワード検索+ID検索をまとめる
- React版のイメージ:検索UIとfilter・findの組み合わせ
- セキュリティ・安全性の視点から見る商品検索プログラム
- ミニ課題のまとめ ― filter・findで「検索の感覚」を身につける
DAY 7:filter・find 前半 ― 「必要なものだけを取り出す」感覚を身につける
DAY 7では、Reactでも必須級の filter() と find() を扱います。 前半では、特に filter()を使った「データの絞り込み」 と、 それが「削除処理」や「検索処理」とどうつながるかを、初心者向けにかみ砕いて説明していきます。
DAY 7全体は次の3回構成を想定しています。
- 前半:
filter()/データの絞り込み/削除処理・検索処理の入り口 - 中盤:
find()/ID検索/オブジェクト配列との組み合わせ - 後半:Reactの状態管理と
filter・findの実践(削除ボタン・詳細表示など)
ここでは、そのうち 前半 にフォーカスして進めていきます。
