入門

API レスポンス加工とは何かAPI レスポンス加工は「外部サービスから受け取ったJSON（欠損・余分・型揺れが混在しがち）を、アプリで使いやすい“整った配列・オブジェクト”に変換する」ことです。ここが重要です：受け取り直後に“検証→正規化...

フォームデータ整形とは何かフォームデータ整形は「UIから入力された生の値（文字列中心・未入力混在・チェックボックスの揺れなど）を、バックエンドが扱いやすい“型の揃ったオブジェクト”に変換する」作業です。ここが重要です：文字列を適切な型（数値...

ページング用データ加工とは何かページングは「長い配列をページ単位に切り分けて、必要な部分だけ表示・送信する」処理です。ここが重要です：順序（ソート）→フィルタ→ページ分割の“処理順”を守り、メタ情報（総件数、総ページ、現在ページの開始・終了...

フィルタ条件切替とは何かフィルタ条件切替は「現在の条件（カテゴリ、価格帯、検索語、ステータスなど）をON/OFFや値変更で切り替え、その都度配列を絞り込む」実務パターンです。ここが重要です：条件を“関数（述語＝predicate）”として組...

フラグ更新とは何かフラグ更新は「オブジェクトや配列の中で、真偽値（true/false）や状態を表す小さな印（flag）を安全に切り替える」操作です。ここが重要です：配列やネスト構造では“直接書き換え”を避け、非破壊更新（イミュータブル）で...

並び替えとは何か並び替え（ソート）は「配列の要素を一定の順序で並べ直す」処理です。ここが重要です：JavaScript の Array.prototype.sort は“文字列として比較する”のが既定動作なので、数値や日付を期待どおりに並べ...

グループ化とは何かグループ化は「配列の要素を“共通のキー”でまとめ、キーごとに要素の集合を作る」処理です。ここが重要です：グループの“鍵（キー）”をどう決めるかで実務の使いやすさが決まります。単純なキー（category、status）だけ...

重複削除とは何か重複削除は「同じ値や同じレコードが複数含まれる配列から、重複を取り除き“1回だけ”にする」処理です。ここが重要です：何を“同じ”とみなすかで手法が変わります。プリミティブ（数値・文字列）は値一致、オブジェクトは“IDやキー”...

一意データの抽出とは何か一意データの抽出は「重複している要素を取り除き、同じものが1回だけ現れる集合にする」処理です。ここが重要です：何を“同じ”とみなすかで手法が変わります。プリミティブ（数値・文字列）なら値一致、オブジェクトなら“IDや...

ID で検索とは何か「ID で検索」は、配列やオブジェクトの中から“特定の一件”を高速・安全に取り出す実務の基本パターンです。ここが重要です：配列から毎回探すのは線形検索で遅くなりがち。頻繁に検索するなら辞書（オブジェクト/Map）に変換し...

再帰処理とは何か再帰は「関数が自分自身を呼び出して、問題を“同じ形のより小さな問題”に分解して解く」テクニックです。ここが重要です：必ず“止まる条件（ベースケース）”を先に書き、次に“1歩進める処理（再帰ケース）”を書く。この2つが揃うと、...

深いコピーとは何か深いコピーは「オブジェクトや配列の入れ子を“最深部まで”複製し、元データと完全に独立させる」操作です。ここが重要です：浅いコピー（スプレッドや Object.assign）は外側だけ新しく、内側は参照を共有します。深いコピ...

データ正規化とは何かデータ正規化は「ネストの深い配列・オブジェクトを、“重複なく参照しやすい形”に整理すること」です。ここが重要です：同じエンティティ（ユーザー、商品、コメントなど）を“1か所だけ”に集約し、他の場所からはID参照にすること...

不変性（イミュータブル）とは何か不変性（イミュータブル）とは「既存のオブジェクトや配列を直接書き換えず、“新しいインスタンス”を作って変更を表現する」考え方です。ここが重要です：直接代入は一見手軽でも、共有参照があると予期せぬ副作用やバグに...

深い階層の更新とは何か深い階層の更新は「入れ子（ネスト）になったオブジェクトや配列の、何層も奥にある値を安全に書き換えること」です。ここが重要です：共有状態（UIやストア）では“非破壊更新（新しいオブジェクトを返す）”が基本。浅いコピーは外...

nullish coalescing（??）とは何かnullish coalescing（??）は「左側が undefined または null のときだけ、右側の“デフォルト値”を使う」演算子です。ここが重要です：0、空文字（""）、fa...

オプショナルチェーンとは何かオプショナルチェーン（?.）は「途中のオブジェクトや配列が null/undefined でも、エラーにせず安全に次へ進む（または止まる）」ための記法です。ここが重要です：?. は null/undefined ...

安全なアクセス（&&）とは何か「安全なアクセス」とは、ネストされたオブジェクトや配列を辿るときに、中間が欠損（null/undefined）でもエラーにせず安全に値を取り出す書き方です。ここが重要です：&& は“短絡評価（ショートサーキット...

ネスト配列とは何かネスト配列は「配列の中にさらに配列が入っている構造」です。2次元（行・列の表）、階層（ツリーの子配列）、グループ化（カテゴリごとの要素）など、現実のデータを自然に表現できます。ここが重要です：扱いの基本は“アクセス（インデ...

ネストオブジェクトとは何かネストオブジェクトは「オブジェクトや配列の中に、さらにオブジェクトや配列が入っている構造」です。現実世界のデータ（ユーザー→住所→郵便番号、注文→明細の配列→各行のSKUなど）を自然に表現できます。ここが重要です：...

デフォルト値の設定とは何かデフォルト値は「値が未指定（または欠損）のときに使う“代替値”」です。ここが重要です：何を“未指定”とみなすかで手段が変わります。undefined/null だけを未指定と扱うのか、0・""・false まで未指...

分割代入（構造の分解）とは何か分割代入は、オブジェクトや配列から「必要な部分だけ」を抜き出して、変数に一気に割り当てる書き方です。ここが重要です：オブジェクトは“キー名で取り出す”、配列は“位置で取り出す”。重複したアクセスコードを減らし、...

JSON とは何かJSON は「データを文字列で表すための軽量フォーマット」です。JavaScript のオブジェクトに“似ている”けれど、JSON はあくまで文字列。送受信・保存に向いており、プログラム内で使うには「文字列 ⇄ オブジェク...

浅いコピーと深いコピーとは何か浅いコピーは「外側のプロパティだけ新しいオブジェクトに複製し、入れ子（オブジェクトや配列）の“参照”はそのまま共有する」コピーです。深いコピーは「入れ子の内部まで再帰的に複製し、元と完全に独立した新しいデータ構...

スプレッド構文によるコピーとは何かスプレッド構文 { ...obj } は「オブジェクトの“自分が持つ列挙可能なプロパティ”を、浅く（シャロー）コピーして新しいオブジェクトを作る」ための書き方です。ここが重要です：コピーされるのは“文字列キ...

Object.assign とは何かObject.assign は「右側のオブジェクトの“自前の列挙可能なプロパティ”を左側（ターゲット）へコピーして上書きする」関数です。ここが重要です：コピーされるのは“文字列キーと Symbol キーの...

for...in とは何かfor...in は「オブジェクトの“列挙可能なキー（プロパティ名）”を1つずつ取り出して処理する」ためのループ構文です。ここが重要です：for...in は“自分のキーだけ”ではなく“継承（プロトタイプ）上のキー...

Object.entries とは何かObject.entries は「オブジェクトが“自分で持つ”列挙可能な文字列キーとその値の組（）」を、配列として返す関数です。ここが重要です：返るのは“自前の・enumerable: true・文字列...

Object.values とは何かObject.values は「オブジェクトが“自分で持つ”列挙可能なプロパティの値だけを、配列で返す」関数です。ここが重要です：返るのは“自前の”かつ“enumerable: true”な“値”で、キー...

Object.keys とは何かObject.keys は「オブジェクトが“自分で持つ”列挙可能なキー（プロパティ名）を、文字列の配列で返す」関数です。ここが重要です：継承（プロトタイプ）上のキーは含まず、Symbol キーは含みません。返...