ZZ. 資料の構成

対象読者・章立ての意図・勉強会の進め方・確かめた版・実行の仕組み

📅 作成: 2026-10-09 / 更新: 2026-10-20

対象読者とゴール

章立ての意図

勉強会の進め方

回範囲ねらい
第1回01〜06環境を動かし、値・型変換・関数に慣れる。01〜03 は読み流し、04 に時間を寄せる
第2回07〜08this ・グローバル変数・プロトタイプ(前半の山)
第3回09〜10クロージャ(後半の山)、エラー処理とモジュール
第4回11〜12非同期(後半の山)、CommonJS と ES Modules
宿題13ハンズオン。第5回の冒頭で振り返る
第5回14〜17第1部の宿題の振り返り。ブラウザで動かし、DOM ・ イベント ・ フォームで画面を動かす
第6回18〜22通信 ・ 保存(18 〜 19 に 45 分)、Web でできることの紹介(20 〜 22 に 30 分。例を動かして見せるだけ)
宿題23ハンズオン(ToDo)。勉強会の最後に見せ合う

1 回は 90 分。振り返りと質問 10 分 / 読み合わせ 50 分 / 演習 25 分 / 次回予告 5 分。第6回は内容が多いので、収まらなければ第7回を足す。

参加者には、事前に Node.js を入れて node --version が表示される状態にしておいてもらう(02 章)。第2部は Chrome か Edge を使う。20 〜 22 章の一部の例は、CDN から読み込むのでネットワークが必要。

確かめた版

資料のコードと出力は、次の環境で実際に動かして確かめた。

もの版
Node.jsv26.11.1
ブラウザ(「▶ 実行」ボタン)Chromium(Chrome ・ Edge と同じエンジン) ・ Firefox

Node.js は v26 系の、資料を作る時点の最新版を使う。版を上げたら、この表を書き換え、テストを流し直す。

実行の仕組みと資料の作り方

「▶ 実行」ボタン

実行の制約

制約起きること
エラーの文面は V8 のもの載せたエラーの文面は Node.js ・ Chrome ・ Edge と同じ V8 のもの。Firefox では同じエラーが別の文面で出る。Safari では確かめていない
値の表示は js/inspect.js による写しPromise の状態(<pending> など)や、エラーが起きた場所(スタック)は、Node.js と同じには出ない
第2部の例(data-run="dom")は時間で打ち切れない無限ループを書くと、ページごと固まる。タブを閉じて開き直す
ネットワークが要る例がある20 〜 22 章の CDN を使う例と、18 章の通信の例は、オフラインでは動かない
ファイルとして直接開いた(file://)とき第1部の例も iframe で動くので、5 秒の打ち切りが効かず、無限ループで固まる。globalThis は self ではなく window になる(07 章)。fetch は使えない。エラーの内容をブラウザが隠すことがある。公開ページか、ローカルサーバ経由(14 章)で開けば、どれも起きない
3 桁区切りなどの書式は、実行する環境の言語設定に従うtoLocaleString() を言語の指定なしで呼ぶ例(04 ・ 10 ・ 13 ・ 15 ・ 17 章)は、日本語の環境(ja-JP)で読む前提で書いている。英語の設定でも同じに見えるが、ほかの言語の設定では区切りの記号が変わる(ドイツ語なら 1.234.567)。環境によらず揃えたいときは toLocaleString("ja-JP") と言語を指定する

資料を書き換えたら

  1. node tools/20_build/build-docs.ts で、前後のナビ ・ 目次 ・ 章の色 ・ 資料一覧を書き込む
  2. tools/40_test/run-tests.cmd でテストを流す。資料の例を Node.js で動かした結果と、ブラウザ(Chromium ・ Firefox)で「▶ 実行」を押した結果の両方を、載せた出力と比べる。Firefox のエラーの文面は、tests/helpers/browser-errors.ts の対応表で載せた文面に読み替えて比べる。資料に例を足して Firefox だけ食い違ったら、この表に足す。docs/samples のファイルが資料と一致しているか、23 章の完成形が操作どおりに動くか、ページが横にはみ出さず Console に警告が出ないかも確かめる
  3. html2md --root . --dir docs --dir notes で Markdown を作り直す