TypeScript
TypeScript | 基礎文法：配列・タプル – 可変長タプル
JavaScript
JavaScript JavaScript 逆引き集 | オブジェクトのキー順ソート（新規オブジェクト作成）
オブジェクトのキー順ソート（新規オブジェクト作成）の基本と実践「オブジェクトのプロパティをキー順に並べ替えて扱いたい」時は、キーを配列にしてソートし、reduceで新しいオブジェクトを組み立てます。元...
JavaScript JavaScript 逆引き集 | 動的プロパティアクセス
動的プロパティアクセス（obj）の基本と実践「キーを変数で指定したい」「ユーザー入力や設定に合わせてプロパティ名が変わる」—そんなときに使うのが角括弧記法 obj。ドット記法は固定名、角括弧は“動的名...
JavaScript JavaScript 逆引き集 | オブジェクトのプロパティ削除
オブジェクトのプロパティ削除（delete obj.key）の基本と実践delete は「そのプロパティをオブジェクトから完全に取り除く」演算子です。キーを消したいときに使い、値を未定義化したいときは...
JavaScript JavaScript 逆引き集 | プロパティの存在チェック
プロパティの存在チェック（'prop' in obj）の基本と実践「そのプロパティある？」を最短で判定するのが in 演算子。自前のプロパティだけでなく、プロトタイプから継承されたプロパティも「存在す...
JavaScript JavaScript 逆引き集 | オブジェクトのマージ
オブジェクトのマージ（浅）— スプレッド構文 {...a, ...b} の基本と実践複数の設定やデータを“上書きルール”で一つにまとめたいときに使うのがスプレッド構文のマージ。右側が勝つ（後勝ち）とい...
JavaScript JavaScript 逆引き集 | 深いコピー（JSON）（注意：関数/undef は除外）
深いコピー（JSON）— JSON.parse(JSON.stringify(obj)) の基本と実践「オブジェクトをまるっと別インスタンスにしたい」場面でよく使われる簡易テクニックが JSON.pa...
JavaScript JavaScript 逆引き集 | オブジェクトのクローン（浅）
オブジェクトのクローン（浅）— スプレッド構文 {...obj} の基本と実践浅いクローンは「一番上の層だけ」をコピーして、新しいオブジェクトを作る方法です。最短はスプレッド構文 {...obj}。ネ...
JavaScript JavaScript 逆引き集 | オブジェクトのエントリ列挙
オブジェクトのエントリ列挙（Object.entries）の基本と実践Object.entries(obj) は「オブジェクトのキーと値のペア」を の形で配列にして返す関数です。キーだけなら Obje...
JavaScript JavaScript 逆引き集 | オブジェクトの値列挙
オブジェクトの値列挙（Object.values）の基本と実践Object.values(obj) は「オブジェクトの 値だけ を配列にして返す」便利な関数です。キーは不要で値だけを処理したいときに最...
JavaScript JavaScript 逆引き集 | オブジェクトのキー列挙
オブジェクトのキー列挙（Object.keys）の基本と実践Object.keys は「オブジェクトの“自分が持つ（自前の）列挙可能なプロパティ名”」を配列で返します。設定画面の項目一覧、テーブルのヘ...
JavaScript JavaScript 逆引き集 | JSON 文字列化／復元
JSON文字列化／復元の基本と実践「オブジェクト⇄文字列」を行き来する最短ルートが JSON.stringify と JSON.parse。保存・送受信・ログ・設定ファイルで頻出です。まずは基本// ...
JavaScript JavaScript 逆引き集 | タイムゾーン指定変換（Intl）
Intl.DateTimeFormatでタイムゾーン指定表示の基本と実践Intl.DateTimeFormatは「表示するロケール」と「表示するタイムゾーン」を明示できるので、どこで実行しても同じ地域...
JavaScript JavaScript 逆引き集 | Intl.DateTimeFormat の利用
Intl.DateTimeFormat の基本と実践Intl.DateTimeFormat はロケールやタイムゾーンに合わせた日付・時刻フォーマットを簡単に行える標準APIです。文字列連結や手作業のゼ...
JavaScript JavaScript 逆引き集 | 日付フォーマット（簡易）
JavaScript日付フォーマット（簡易）の基本と実践最短で「YYYY-M-D」などの文字列にしたいなら、Dateの各値を取り出してテンプレートリテラルで組み立てます。月は0始まりなので「+1」を忘...
JavaScript JavaScript 逆引き集 | 日付の差分（日数）
JavaScriptで日付の差分（日数）を求める基本と実践「2つの日時の差を“日数”で知りたい」ときは、2つのDateの差（ミリ秒）を1日のミリ秒で割るのが基本です。まず仕組みと丸め方、そしてタイムゾ...
JavaScript JavaScript 逆引き集 | 日付を ISO 文字列に
JavaScriptで日付をISO文字列にする（toISOString）の基本と実践ISO 8601形式はシステム間で扱いやすい標準日時フォーマットです。new Date().toISOString(...
JavaScript JavaScript 逆引き集 | 日付の現在取得
JavaScriptで現在日時を取得する（new Date）の基本と実践「今の日時が欲しい」ときは new Date()。これで現在の日時を表す Dateオブジェクトが作れます。そこから年・月・日・時...
JavaScript JavaScript 逆引き集 | ランダム整数生成
JavaScriptランダム整数生成の基本と実践「0以上n未満のランダムな整数」を作る定番が Math.floor(Math.random() * n)。仕組みを理解すれば、任意の範囲の整数にも応用で...
JavaScript JavaScript 逆引き集 | 数値の丸め（Math）
JavaScript数値の丸め（Math.round / Math.ceil / Math.floor）丸めは「端数をどう扱うか」を決める操作。表示や料金計算、ページネーションなどで頻出です。まずは3...
JavaScript JavaScript 逆引き集 | 数値を固定小数点
JavaScript数値の固定小数点表示（toFixed）の基本と実践金額や割合など「小数点以下の桁数を揃えたい」ときは toFixed。指定した桁数に丸め、足りない桁は0で埋めた文字列を返します。構...
JavaScript JavaScript 逆引き集 | テンプレートリテラル
JavaScriptテンプレートリテラルの基本と実践テンプレートリテラルはバッククォートで囲み、${...}の中に変数や式を埋め込めます。文字列連結より短く、読みやすく、改行もそのまま扱えます。構文と...
JavaScript JavaScript 逆引き集 | 正規表現で部分抽出（キャプチャ）
JavaScript正規表現で部分抽出（キャプチャ）の基本と実践正規表現の キャプチャグループ (...) を使うと、文字列の一部を抜き出せます。match の返り値は配列で、 に「全体一致」、 以降...
JavaScript JavaScript 逆引き集 | 正規表現で置換（全体）
JavaScript正規表現で置換（replace）の基本と実践文字列の中の「一致した部分」を別の文字列に置き換えるのが replace。正規表現を使えば「全件置換」や「一部だけ抜き出して再配置」も柔...
JavaScript JavaScript 逆引き集 | 正規表現でマッチ
JavaScript正規表現でマッチ（match）の基本と実践文字列から「パターンに合う部分」を見つけて取り出すなら match。1件だけか、すべてか、グループ抽出かで挙動が変わるので、最初に仕組みを...
JavaScript JavaScript 逆引き集 | 文字列を大文字／小文字
JavaScript文字列の大文字・小文字変換の基本と実践文字列を「全部大文字」「全部小文字」に揃えたいときは、toUpperCase と toLowerCase が最短ルート。検索や比較、表示整形で...
JavaScript JavaScript 逆引き集 | 文字列のトリム
JavaScript文字列のトリムの基本と実践文字列の前後にある余分な空白や改行を取り除くときは trim を使います。元の文字列は変えず、前後のホワイトスペースだけを除いた新しい文字列を返します。構...
JavaScript JavaScript 逆引き集 | split で文字列分割
JavaScript文字列の分割（split）の基本と実践文字列を「区切り文字」で分けて配列にするのが split。CSVの処理、URLやパスの分解、複数行テキストの扱いなどで頻出です。初心者でもすぐ...
JavaScript JavaScript 逆引き集 | join で文字列結合
JavaScript配列の文字列結合（join）の基本と実践配列の要素を指定した区切り文字でつないで、1つの文字列にするのが join。CSV作成、UI表示、ログ出力などでよく使います。構文と基本ポイ...
JavaScript JavaScript 逆引き集 | 配列の分割（chunk）
JavaScript配列の分割（chunk）の基本と実践「配列を一定サイズごとに分割したい」場面はよくあります。例えば、ページネーションやバッチ処理など。JavaScriptには標準で chunk 関...
JavaScript JavaScript 逆引き集 | 配列をユニークに（オブジェクトキーで）
JavaScript配列をユニークに（オブジェクトキーで）lodashの _.keyBy を使うと「オブジェクト配列の重複を特定のキーでまとめて、ユニーク化」できます。プリミティブ値なら Set で十...
JavaScript JavaScript 逆引き集 | 配列の重複除去（Set）
JavaScript配列の重複除去（Set）の基本と実践配列に同じ値が何度も入っているとき、「ユニークな値だけ欲しい」場面があります。そんなときに便利なのが Set とスプレッド構文 ... を組み合...
JavaScript JavaScript 逆引き集 | 配列を逆順
JavaScript配列を逆順にする（reverse）の基本と実践reverseは配列の並びをその場で反転します。最初の要素が最後に、最後の要素が最初になります。元の配列が直接書き換えられる点が重要で...
JavaScript JavaScript 逆引き集 | 配列のソート（数値）
JavaScript配列のソート（数値）の基本と実践数値配列を正しく並べ替えるには、比較関数を渡して「数値として」比較させるのがポイントです。デフォルトのsortは文字列として比較するため、数値だと期...
JavaScript JavaScript 逆引き集 | スプレッドで配列コピー/結合
JavaScriptスプレッド構文で配列コピー／結合配列を「そのままコピーしたい」「複数の配列をつなげたい」ときに便利なのが スプレッド構文（...）。初心者でも直感的に書けて、concatよりも短く...
JavaScript JavaScript 逆引き集 | concat で配列結合
JavaScript配列の結合（concat）の基本と実践「2つ以上の配列をつなげたい」ときに使うのが concat。初心者でも直感的に扱えるメソッドで、元の配列を壊さず新しい配列を返してくれるのが特...
JavaScript JavaScript 逆引き集 | flatMap の変換＋平坦化
JavaScript配列の変換＋平坦化（flatMap）の基本と実践「mapで変換した結果が配列になってしまう → そのままでは二重配列になる」そんなときに便利なのが flatMap。mapとflat...
JavaScript JavaScript 逆引き集 | flat で1階層平坦化
JavaScript配列の平坦化（flat）の基本と実践配列の中に配列が入っていると「二重配列」「ネスト配列」と呼ばれます。これを「1階層だけまっ平らにしたい」ときに使うのが flat。初心者でも直感...
JavaScript JavaScript 逆引き集 | every で全件判定
JavaScript配列の全件判定（every）の基本と実践「配列のすべてが条件を満たす？」を一度で確かめるなら every。すべてが条件に合えばtrue、1つでも合わなければfalseを返します。最...
JavaScript JavaScript 逆引き集 | some でいずれか判定
JavaScript配列のいずれか判定（some）の基本と実践「条件に合う要素がひとつでもある？」を真っ直ぐに確かめるなら some。true/falseだけ返すので、存在チェックやバリデーションに向...
JavaScript JavaScript 逆引き集 | includes で存在確認（原始値）
JavaScript配列の存在確認（includes）の基本と実践「この値、配列に入ってる？」を一発で確かめるなら includes。true/falseだけ返すシンプルさが強みで、indexOfより...
JavaScript JavaScript 逆引き集 | findIndex でインデックス取得
JavaScript配列のインデックス取得（findIndex）の基本と実践「条件に合う要素が配列のどこにあるか」を知りたいなら findIndex。見つかった最初の位置（インデックス）を返し、見つか...
JavaScript JavaScript 逆引き集 | find で最初の一致を取得
JavaScript配列から最初の一致を取得（find）の基本と実践「条件に合う最初の要素を1つだけ取り出したい」なら find が最適です。filterは「全部」を返しますが、findは「最初の1件...
JavaScript JavaScript 逆引き集 | reduce で集計
JavaScript配列の集計（reduce）の基本と実践「配列の値をまとめて1つにしたい」ときに使うのが reduce。合計・平均・最大値・オブジェクト化など、集計処理の万能ツールです。初心者には少...
JavaScript JavaScript 逆引き集 | filter で条件抽出
JavaScript配列の条件抽出（filter）の基本と実践「条件に合う要素だけを取り出して新しい配列を作りたい」なら、filterが最短で安全。元の配列は変えず、判定関数がtrueを返した要素だけ...
JavaScript JavaScript 逆引き集 | map で配列変換
JavaScript配列変換（map）の基本と実践「配列の各要素を加工して、新しい配列を作りたい」なら map が最短ルート。元の配列には触れず、処理結果だけを返してくれるので、初心者でも安全に“変換...
JavaScript JavaScript 逆引き集 | 配列のループ（forEach）
JavaScript配列のループ（forEach）の基本と実践「配列の全要素に同じ処理をサッと当てたい」なら、forEachがいちばん手軽。カウンターや終了条件を意識せず、読みやすく安全に“全件処理”...
JavaScript JavaScript 逆引き集 | 配列のループ（for…of）
JavaScript配列のループ（for...of）の基本と実践最初は「インデックスって必要？」と迷うかもしれないけれど、値だけ順に扱いたいなら for...of がいちばん素直で読みやすい。配列から...
JavaScript JavaScript 逆引き集 | 配列のループ（for）
JavaScript配列のループ（for）の基本と実践最初の一歩って、つまずきやすい。でも「for」は味方。配列を順番に処理するためのいちばん素直なやり方で、仕組みがわかると一気に視界が開けます。ここ...
JavaScript Python JavaScript | プログラミングの繰り返し処理でマジックナンバーを避ける方法
「なんとなく書いた数字」が、後からあなたや他の人を困らせる。それがマジックナンバー。まずは意味をつかんで、繰り返し処理（ループ）での具体的な回避テクを身につけましょう。 マジックナンバーの基礎定義: ...
JavaScript JavaScript | 「ソースマップ」付きで TypeScript や Babel コードをデバッグする方法
ここでは、「ソースマップ付きで TypeScript や Babel 変換後のコードをブラウザでデバッグする方法」を、🔰 初心者向けにステップごとで分かりやすく解説します。そもそも「ソースマップ」って...
JavaScript JavaScript | VSCode のデバッガコンソールで式を評価して調べる方法
ここでは VSCode のデバッガコンソールを使って、デバッグ中に式や変数を確認・評価する方法 を初心者向けに丁寧に解説します。デバッグを「止まって眺めるだけ」から「動かしながら調べる」に進化させるテ...
JavaScript JavaScript | 非同期処理（Promise / async）のステップ実行を例で体験
では、非同期処理（Promise / async/await）のステップ実行を、VSCodeデバッガで体験する例を、初心者向けに手順付きで進めていきます。1. サンプルコードを作るまず小さな非同期処理...
JavaScript JavaScript | Node.js 環境での「–inspect」デバッグ手順（VSCode でのステップ実行）
ここでは、Node.js の --inspect モードを使って VSCode でステップ実行（デバッグ）する方法を、プログラミング初心者向けに 手順通りに進められるチュートリアル形式で解説します。目...
JavaScript JavaScript | 非同期エラー（Promiseやasync/await）のスタックトレース
「ブラウザ開発ツール（DevTools） を使ったデバッグ」は、初心者から“実務で通用する人”へ進むための大きな一歩です。ここでは、Chrome / Edge / Firefox に共通する操作を中心...
JavaScript JavaScript | 非同期エラー（Promiseやasync/await）のスタックトレース
非同期エラーのスタックトレースは「同期コードのそれ」とは挙動が違う部分が多く、つまずきやすいポイントです。以下は 初心者が実務で遭遇するパターン を中心に、具体的なコード例と「何を見ればいいか」「どう...
JavaScript JavaScript | 月別アルバムページ × タグフィルタ × 地図表示
ここまでの要素を全部組み合わせて、「月別アルバムページ」＋「タグフィルタ」＋「地図表示」 を統合したギャラリーの仕組みを整理してみましょう。1. 処理の流れ画像を読み込みPillowでサムネイル生成E...
JavaScript JavaScript | フォームバリデーション（入力チェック）
特徴リアルタイム判定入力するたびにOK/NGを表示。NG時に修正候補をボタンで自動適用メール → 「@example.com」を補完電話 → 桁数を補正してハイフン整形URL → https:// を...
JavaScript JavaScript | 再帰とループの性能比較
「再帰」と「ループ」は同じ処理を実現できることが多いですが、性能面では違いがあります。初心者向けに整理してみます。性能比較のポイント1. 関数呼び出しのコスト再帰関数を呼ぶたびに「呼び出しスタック」に...
JavaScript JavaScript | レベル別練習問題：エレメント（HTML要素・DOM要素操作）
「エレメント」をテーマに、基礎／中級／上級（応用）の3レベル、各5問ずつ、合計15問のオリジナル練習問題を作成し、解答と解説付きでまとめます。ここでいう「エレメント」は HTML要素・DOM要素操作 ...
JavaScript JavaScript | レベル別練習問題：関数
「関数」 をテーマに、基礎 / 中級 / 上級（応用） 各レベル 5 問ずつ、合計 15 問のオリジナル練習問題＋解答＋解説を作成しました。コードはそのままブラウザのコンソールで実行できます。基礎レベ...