JavaScript Documentation
Concise, example-driven JavaScript reference. Read the concept, see the code, then practice it in a Coddy journey.
Start a guided JavaScript journeyはじめに
- JavaScriptとはJavaScriptって結局何なのか、どこで動いて何に使えるのか。JavaとTypeScriptとの違いまで、初心者がつまずきやすいポイントを整理して解説します。
- JSの実行方法JavaScriptを動かす方法は主に3つ。ブラウザのコンソール、HTMLの`<script>`タグ、そしてNode.js。それぞれの使いどころを実例で解説します。
- 構文とセミコロンJavaScriptの構文(文・ブロック・式)の基本と、セミコロンの正しい書き方、そして自動セミコロン挿入(ASI)でハマりやすい落とし穴までまとめて解説します。
- strictモードJavaScriptのstrictモードが何を変えるのか、`'use strict'`の書き方、そしてES modulesやclassで自動的に有効になる仕組みまでをまとめて解説します。
- コメントJavaScriptのコメントの書き方を整理。単一行は `//`、複数行は `/* */`。ノイズにならない、本当に役立つコメントの書き方も解説します。
変数と型
- let・const・varJavaScriptで変数を宣言する3つの方法を徹底比較。なぜ現代のコードでは`const`を基本に、必要な時だけ`let`、そして`var`はほぼ使わないのか、その理由を解説します。
- プリミティブ型JavaScriptのプリミティブ型は全部で7つ。string・number・bigint・boolean・null・undefined・symbolの特徴と、オブジェクト型との違いを整理します。
- 文字列とテンプレートJavaScriptの文字列の扱い方を実例で解説。クォートとバッククォートの違い、変数の埋め込み、複数行テキスト、そして現場で実際に使う文字列メソッドまで一気に押さえます。
- 数値とBigIntJavaScriptのNumber型の正体を解説。浮動小数点の誤差、MAX_SAFE_INTEGERの壁、そしてBigIntを使うべき場面まで実例で整理します。
- null と undefinedJavaScriptのnullとundefinedは何がどう違うのか、両方をまとめて判定する書き方、そして自分のコードではどちらを使うべきかを整理します。
- 型変換JavaScriptの型変換の仕組みを整理。ハマりがちな暗黙の変換ルール、できるだけ使いたい明示的な変換、そしてそれぞれが発動するタイミングをまとめました。
- 等価演算子JavaScriptの等価比較を整理。厳密等価 === とゆるい等価 == の挙動の違い、NaNやオブジェクト比較のクセ、Object.isを使うべき場面まで実例でまとめます。
制御フロー
- 演算子JavaScriptの演算子を一通り整理。計算、値の比較、真偽値の組み合わせ、代入まで、実際にハマりやすい落とし穴もあわせて解説します。
- if / elseJavaScriptのif/else文の書き方を基本から解説。条件式、else ifでの多分岐、truthy/falsyの落とし穴、三項演算子の使いどころまで一気に整理します。
- switch文JavaScriptのswitch文の基本を解説。case・break・defaultの使い方、フォールスルーの落とし穴、if/elseとの使い分けまで一通り押さえます。
- for文JavaScriptのfor文の基本構文から、配列のループ、break・continue、ネストしたループ、無限ループの回避まで実例つきで解説します。
- while文JavaScriptの`while`と`do...while`ループの書き方を実例で解説。`for`との使い分けや、無限ループを避けるコツまでまとめました。
- for...of と for...in配列は値、オブジェクトはキー——JavaScriptのfor...ofとfor...inの違いを整理し、どちらをいつ使うべきかを実例で解説します。
- truthyとfalsyJavaScriptでtruthy/falsyとみなされる値は何か。falsyな値の完全リストと、実際のコードでboolean変換がどう働くかを整理します。
イテレーション
関数
- 関数宣言JavaScriptで関数を宣言する方法をまとめました。functionキーワードの書き方、引数とreturn、巻き上げ(ホイスティング)、関数宣言と関数式の使い分けまで一気に解説します。
- アロー関数JavaScriptのアロー関数を基礎から解説。`=>`の書き方、暗黙のreturn、`this`が親スコープに紐づく仕組み、そして`function`と使い分ける判断基準まで押さえます。
- デフォルト引数JavaScriptの関数パラメータを基礎から解説。デフォルト値の書き方、undefinedとの関係、評価順、そして「引数」と「パラメータ」の違いまでまとめました。
- スプレッドとRestJavaScriptの`...`演算子の使い方を徹底解説。Restパラメータで引数をまとめたり、スプレッド構文で配列・オブジェクトを展開する方法、それぞれの使い分けまで実例で紹介します。
- クロージャクロージャとは、外側のスコープにある変数を「覚えている」関数のこと。JavaScriptでのクロージャの仕組みを、動くサンプルコードと実際のユースケースで解説します。
- thisキーワードJavaScriptの`this`が実際にどう動くのか。4つのバインディングルール、アロー関数でthisが違う理由、そして「thisがundefined問題」のハマりどころを整理します。
- 高階関数JavaScriptの高階関数をゼロから解説。関数を引数として渡す・戻り値として返すという考え方と、実務で毎日使うmap・filter・reduceの基本パターンをまとめました。
オブジェクトと配列
- オブジェクトJavaScriptのオブジェクトの仕組みを基礎から解説。生成方法、プロパティの読み書き、メソッドの追加、コードを読みやすく保つための定番パターンまでまとめて紹介します。
- 配列JavaScriptの配列の基本から実践まで。作成方法、インデックス参照、length、push/pop、sliceとspliceの違い、そして見やすいループの書き方をまとめて解説します。
- 分割代入JavaScriptの分割代入(destructuring)を基礎から解説。オブジェクト・配列の取り出し、リネーム、デフォルト値、ネスト、関数引数、restパターンまで実例付きで紹介します。
- スプレッド構文JavaScriptのスプレッド構文(...obj)の使い方を実例で解説。オブジェクトのコピー、マージ、プロパティの上書きから、シャローコピーの落とし穴まで一気に整理します。
- 配列メソッドfor文の9割を置き換えられる配列メソッド(map・filter・reduce・find・some・every)の使い方と、元の配列を変更するメソッドとしないメソッドの違いをまとめました。
- MapとSetJavaScriptのMapとSetの基本から、ただのオブジェクトや配列と何が違うのか、どんな場面で使うと効くのかを実例付きで解説します。
- JSONJavaScriptのオブジェクトをJSONに変換する方法、そしてJSONから元に戻す方法を実例で解説。JSON.stringifyとJSON.parse、replacer・reviverの使い方、ラウンドトリップで失われる値の注意点まで一気に押さえます。
- オプショナルチェーン`?.` 演算子を使えば、null や undefined で落ちることなく、ネストされたオブジェクトや配列、メソッドに安全にアクセスできます。
- Null合体演算子`??`演算子は値が`null`または`undefined`のときだけデフォルト値を返します。`||`では落とし穴になる`0`や空文字をきちんと扱えるのがポイントです。
クラスとプロトタイプ
- クラスJavaScriptのクラスの仕組みを、constructor・メソッド・インスタンスフィールド・ゲッター/セッターまで、実際の書き方を通して理解できるように解説します。
- 継承JavaScriptのクラス継承を基礎から整理。extendsでの継承、superの呼び出し、メソッドのオーバーライド、そして継承が向かない場面まで解説します。
- staticメンバーJavaScriptクラスのstaticメソッドとプロパティの使い方を解説。`this`の挙動や、ファクトリパターンでの活用例まで実践的にまとめました。
- プライベートフィールド`#`プレフィックスでクラスのフィールドやメソッドを本当の意味でプライベートにする方法。アンダースコア命名規則では不十分な理由も合わせて解説します。
- プロトタイプJavaScriptのプロトタイプとは何か、プロパティ検索がプロトタイプチェーンをどう辿るのか、そして`class`構文が内部でどうプロトタイプに対応しているのかを解説します。
非同期 JavaScript
- イベントループ非同期JavaScriptを理解するための土台。コールスタック、タスクキュー、マイクロタスクキュー、そしてそれらをつなぐイベントループの仕組みを整理します。
- コールバックJavaScriptのコールバック関数の仕組みを基礎から解説。関数を引数として渡す方法、エラーファーストパターン、そしてネストが深くなる「コールバック地獄」からPromiseへ移行した経緯まで。
- PromiseJavaScriptのPromiseの仕組みを整理。3つの状態、then・catchでのチェーン、Promise.allでの並列処理、new Promiseで自作する方法まで解説します。
- async/awaitJavaScriptのasync/awaitを実例で解説。async関数の書き方、awaitでPromiseを待つ流れ、try/catchでのエラー処理、Promise.allでの並列実行まで一気にわかります。
- Fetch APIJavaScriptのFetch APIの使い方をまとめて解説。GET/POSTリクエストの送り方、JSONのパース、正しいエラーハンドリング、AbortControllerによるキャンセル処理まで実例つきで紹介します。
- 非同期エラー処理async/awaitのtry/catch、Promiseの.catch、そしてエラーを握りつぶしてしまいがちな落とし穴まで。非同期JavaScriptでエラーがどう流れるかを実例で整理します。
モジュールとツール
- ESモジュールJavaScriptのESモジュールの仕組みを実例で解説。名前付きexportとdefault export、importの書き方、動的import()、そして通常のスクリプトとの違いまで整理します。
- CommonJS と ESMNode.jsにはなぜ2つのモジュール方式があるのか。requireとimportの違い、使い分けの基準、.mjs/.cjsの扱いまでまとめて整理します。
- npmの基本npmの仕組みをゼロから解説。install、init、devDependenciesの使い分け、パッケージの更新・削除、node_modulesとlockfileの考え方までまとめました。
- package.jsonpackage.jsonの中身を一通り整理。押さえるべきフィールド、scriptsの動き、^や~のsemver指定でnpmが入れるバージョンがどう決まるのかをまとめます。
- NodeランタイムNode.jsランタイムの正体、ブラウザとの違い、そしてglobalsやmodules、process、fsといったサーバーサイドJavaScriptを支える主要APIをまとめて解説します。