【2023年】JavaScript本「人気・高評価のおすすめ本20冊」

Chapter1 React を始める前に知っておきたいモダンJavaScript の基礎
1-1 モダンJavaScript 概説
1-2 DOM、仮想DOM
1-3 パッケージマネージャー(npm/yarn)
1-4 ECMAScript
1-5 モジュールバンドラー、トランスパイラ
1-6 SPA と従来のWeb システムの違い .. .
Chapter1 まとめ
Chapter2 モダンJavaScript の機能に触れる
2-1 const、let での変数宣言
2-2 テンプレート文字列
2-3 アロー関数 ( ) => { }
2-4 分割代入 { } [ ]
2-5 デフォルト値 =
2-6 スプレッド構文
2-7 オブジェクトの省略記法
2-8 map、filter
Chapter2 まとめ
Chapter3 JavaScript でのDOM 操作
3-1 JavaScript によるDOM アクセス
3-2 DOM の作成、追加、削除
3-3 JavaScript によるDOM 操作実践
Chapter3 まとめ
Chapter4 React の基本
4-1 React 開発の始め方
4-2 JSX 記法
4-3 コンポーネントの使い方
4-4 イベントやスタイルの扱い方
4-5 Props
4-6 State（useState）
4-7 再レンダリングと副作用（useEffect）
4-8 export の種類
Chapter4 まとめ
Chapter5 React とCSS
5-1 Inline Styles
5-2 CSS Modules
5-3 Styled JSX
5-4 styled components
5-5 Emotion
5-6 Tailwind CSS
Chapter5 まとめ
Chapter6 再レンダリングの仕組みと最適化
6-1 再レンダリングが起きる条件
6-2 レンダリング最適化1（memo）
6-3 レンダリング最適化2（useCallback）
6-4 変数のmemo 化（useMemo）
Chapter6 まとめ
Chapter7 グローバルなState 管理
7-1 グローバルなState 管理が必要な理由
7-2 Context でのState 管理
7-3 その他のグローバルstate を扱う方法
Chapter7 まとめ
Chapter8 React とTypeScript
8-1 TypeScript の基本
8-2 API で取得するデータへの型定義
8-3 Props への型定義
8-4 型定義の管理方法
8-5 コンポーネントの型定義
8-6 省略可能な型の定義
8-7 オプショナルチェイニング（Optional chaining）
8-8 ライブラリの型定義
Chapter8 まとめ
Chapter9 カスタムフック
9-1 カスタムフックとは
9-2 カスタムフックの雛形を作成
9-3 カスタムフックの実装
Chapter9 まとめ
付録 React × TypeScript 実践演習

齊藤新三（サイトウシンゾウ）
ＷＩＮＧＳプロジェクト所属のテクニカルライター。Ｗｅｂ系製作会社のシステム部門、ＳＩ会社を経てフリーランスとして独立。屋号はＳａｒｖａ（サルヴァ）。Ｗｅｂシステムの設計からプログラミング、さらには、Ａｎｄｒｏｉｄ開発までこなす。現在は、ＨＡＬ大阪の非常勤講師を兼務

山田祥寛（ヤマダヨシヒロ）
フリーライター。Ｍｉｃｒｏｓｏｆｔ　ＭＶＰ　ｆｏｒ　Ｖｉｓｕａｌ　Ｓｔｕｄｉｏ　ａｎｄ　Ｄｅｖｅｌｏｐｍｅｎｔ　Ｔｅｃｈｎｏｌｏｇｉｅｓ。執筆コミュニティ「ＷＩＮＧＳプロジェクト」の代表でもある（本データはこの書籍が刊行された当時に掲載されていたものです）

Chapter1 React を始める前に知っておきたいモダンJavaScript の基礎
1-1 モダンJavaScript 概説
1-2 DOM、仮想DOM
1-3 パッケージマネージャー(npm/yarn)
1-4 ECMAScript
1-5 モジュールバンドラー、トランスパイラ
1-6 SPA と従来のWeb システムの違い .. .
Chapter1 まとめ
Chapter2 モダンJavaScript の機能に触れる
2-1 const、let での変数宣言
2-2 テンプレート文字列
2-3 アロー関数 ( ) => { }
2-4 分割代入 { } [ ]
2-5 デフォルト値 =
2-6 スプレッド構文
2-7 オブジェクトの省略記法
2-8 map、filter
Chapter2 まとめ
Chapter3 JavaScript でのDOM 操作
3-1 JavaScript によるDOM アクセス
3-2 DOM の作成、追加、削除
3-3 JavaScript によるDOM 操作実践
Chapter3 まとめ
Chapter4 React の基本
4-1 React 開発の始め方
4-2 JSX 記法
4-3 コンポーネントの使い方
4-4 イベントやスタイルの扱い方
4-5 Props
4-6 State（useState）
4-7 再レンダリングと副作用（useEffect）
4-8 export の種類
Chapter4 まとめ
Chapter5 React とCSS
5-1 Inline Styles
5-2 CSS Modules
5-3 Styled JSX
5-4 styled components
5-5 Emotion
5-6 Tailwind CSS
Chapter5 まとめ
Chapter6 再レンダリングの仕組みと最適化
6-1 再レンダリングが起きる条件
6-2 レンダリング最適化1（memo）
6-3 レンダリング最適化2（useCallback）
6-4 変数のmemo 化（useMemo）
Chapter6 まとめ
Chapter7 グローバルなState 管理
7-1 グローバルなState 管理が必要な理由
7-2 Context でのState 管理
7-3 その他のグローバルstate を扱う方法
Chapter7 まとめ
Chapter8 React とTypeScript
8-1 TypeScript の基本
8-2 API で取得するデータへの型定義
8-3 Props への型定義
8-4 型定義の管理方法
8-5 コンポーネントの型定義
8-6 省略可能な型の定義
8-7 オプショナルチェイニング（Optional chaining）
8-8 ライブラリの型定義
Chapter8 まとめ
Chapter9 カスタムフック
9-1 カスタムフックとは
9-2 カスタムフックの雛形を作成
9-3 カスタムフックの実装
Chapter9 まとめ
付録 React × TypeScript 実践演習

第１章　イントロダクション
第２章　基本的な文法・基本的な型
第３章　オブジェクトの基本とオブジェクトの型
第４章　ＴｙｐｅＳｃｒｉｔｐの関数
第５章　ＴｙｐｅＳｃｒｉｐｔのクラス
第６章　高度な型
第７章　ＴｙｐｅＳｃｒｉｐｔのモジュールシステム
第８章　非同期処理
第９章　ＴｙｐｅＳｃｒｉｐｔのコンパイラオプション
付録

鈴木僚太（スズキリョウタ）
２０１３年からＴｙｐｅＳｃｒｉｐｔを使用中。ＬＩＮＥ株式会社でフロントエンドエンジニアとして自社開発に従事しながら、技術顧問なども行っている（『プロを目指す人のためのＴｙｐｅＳｃｒｉｐｔ入門ー安全なコードの書き方から高度な型の使い方まで』発行当時）。専門はＴｙｐｅＳｃｒｉｐｔとＲｅａｃｔで、講演やインターネット上での記事公開を通じて初心者向けから上級者向けまでさまざまな情報を発信している。ＯＳＳ活動にも積極的だが自作のライブラリはあまり流行っていない（本データはこの書籍が刊行された当時に掲載されていたものです）

Chapter 1　基本のHTML&CSSを使おう
1-1　Webの開発って、なに？
1-2　HTMLを使おう
1-3　スタイルシートでデザインしよう
1-4　さまざまなスタイルを利用しよう
Chapter 2　JavaScriptの基本を覚えよう
2-1　値と変数をマスターしよう
2-2　構文を覚えよう
2-3　関数とオブジェクト
Chapter 3　Webを操作しよう
3-1　DOMを操作しよう
3-2　DOMオブジェクトを操作しよう
Chapter 4　グラフィックを操作しよう
4-1　Canvasを使おう
4-2　グラフィックを動かそう
Chapter 5　サーバープログラムを作ろう
5-1　PHPを使えるようになろう
5-2　Webのさまざまな機能を使おう
Chapter 6　本格アプリに挑戦しよう
6-1　アイテム収集ゲーム「Collect It!」
6-2　2D 擬似アドベンチャーゲーム「Adventurer」
Chapter 7　スマホアプリに挑戦！
7-1　Monacaを使いこなそう
7-2　プレビューとデバッグ

Chapter1 イントロダクション
1-1 これからJavaScriptを始める皆さんへ
1-2 JavaScriptってどういうもの？
1-3 JavaScriptの「プログラミング」と動作の仕組み
1-4 各章の概要
1-5 用意するツール
1-6 サンプルデータのダウンロード
1-7 テンプレートを準備して、いざ出発！
Chapter2 アウトプットの基本
2-1 コンソールにアウトプット ～開発ツールを使ってみよう
2-2 JavaScriptはどこに書く？ ～<script>タグとJavaScriptの記述場所
2-3 ダイアログボックスを表示する ～window.alert()
2-4 HTMLを書き換える ～要素を取得する・コンテンツを書き換える

Chapter3 JavaScriptの文法と基本的な機能
3-1 確認ダイアログボックスを表示する ～条件分岐（if）
3-2 入力内容に応じて動作を変更する ～変数、定数
3-3 動作のバリエーションを増やす ～条件分岐（else if）
3-4 数当てゲーム ～比較演算子、データ型
3-5 時間で異なるメッセージを表示する ～論理演算子
3-6 １枚、２枚、３枚…と出力する ～回数が決まっている基本の繰り返し
3-7 コンソールでモンスターを倒せ！ ～回数が決まっていない繰り返し
3-8 税込価格を計算する ～ファンクション
3-9 FizzBuzz ～算術演算子
3-10 項目をリスト表示する ～配列
3-11 アイテムの価格と在庫を表示する ～オブジェクト

Chapter4 インプットとデータの加工
4-1 フォームの入力内容を取得する ～入力内容の取得とイベント
4-2 わかりやすく日時を表示する ～Dateオブジェクト
4-3 小数第◯位で切り捨てる ～Mathオブジェクト

Chapter5 一歩進んだテクニック
5-1 カウントダウンタイマー ～時間の計算とタイマー
5-2 プルダウンメニューで指定ページへ ～URLの操作、ブール属性の設定
5-3 プライバシーポリシー承認パネルを作る ～クッキー（cookie）
5-4 イメージの切り替え ～サムネイルのクリックによる画像の切り替え
5-5 スライドショー ～ここまでの知識を総動員

Chapter6 jQuery入門
6-1 開閉するナビゲーションメニュー ～要素の取得とclass属性の追加・削除
6-2 ドロワーを作ってみよう ～CSSと組み合わせてアニメーションを実現
6-3 空き席状況をチェック ～AjaxとJSON

Chapter7 外部データを活用したアプリケーションに挑戦！
7-1 あなたはいまどこ？ ～位置情報（navigator.geolocation）
7-2 Web APIを使ってみよう ～OpenWeatherMap APIで天気予報

田中賢一郎（タナカケンイチロウ）
１９９４年慶應義塾大学大学院理工学部修了。同年キヤノン株式会社に入社。２０００年にデジタル放送立ち上げの会社に出向。その間に一人でデータ放送ブラウザを実装し、マイクロソフトへソースライセンスする。２００８年よりＷｉｎｄｏｗｓ　Ｍｅｄｉａ　Ｃｅｎｔｅｒ　ＴＶチームの開発者としてマイクロソフトディベロップメント株式会社へ。その後、Ｗｉｎｄｏｗｓ開発部、Ｘｂｏｘ、Ｏｆｆｉｃｅ　３６５と漂流し、２０１５年１０月、中小企業診断士の登録を機にマイクロソフトを退社（本データはこの書籍が刊行された当時に掲載されていたものです）

ＪａｖａＳｃｒｉｐｔの概要
字句構造
型、値、変数
式と演算子
文
オブジェクト
配列
関数
クラス
モジュール
ＪａｖａＳｃｒｉｐｔ標準ライブラリ
イテレータとジェネレータ
非同期ＪａｖａＳｃｒｉｐｔ
メタプログラミング
Ｗｅｂブラウザ上のＪａｖａＳｃｒｉｐｔ
Ｎｏｄｅ上のサーバサイドＪａｖａＳｃｒｉｐｔ
ＪａｖａＳｃｒｉｐｔのツールと拡張機能

フラナガン，デイビッド（Flanagan,David）
１９９５年からＪａｖａＳｃｒｉｐｔのプログラマ兼著者。妻や子供と一緒に、ワシントン州シアトル市とブリティッシュコロンビア州バンクーバーの間のパシフックノースウェストに暮らしている。マサチューセッツ工科大学でコンピュータ科学とコンピュータ工学の学位を取得し、ＶＭｗａｒｅでソフトウェアエンジニアとして働いている

村上列（ムラカミレツ）
兵庫県生まれ。京都大学大学院工学研究科修了。計算機やネットワークの世界に足を踏み入れ現在にいたる（本データはこの書籍が刊行された当時に掲載されていたものです）

桜庭洋之（サクラバヒロユキ）
中学生でインターネットに出会いプログラミングにはまる。自宅サーバやルータ自作をし、大量トラフィックサービスを運営してきた。現在は、株式会社ベーシックに所属し、Ｗｅｂからスマホアプリまで様々な開発をしている。自身のＹｏｕＴｕｂｅ「ムーザルちゃんねる」でプログラミング動画を発信している

望月幸太郎（モチズキコウタロウ）
Ｗｅｂアプリケーションを開発するエンジニア。大学では数学、アルゴリズムの計算量などについて学んだ。より良いソフトウェアを求めて、チームづくりやコード設計について日々試行錯誤している（本データはこの書籍が刊行された当時に掲載されていたものです）

Chapter1 React を始める前に知っておきたいモダンJavaScript の基礎
1-1 モダンJavaScript 概説
1-2 DOM、仮想DOM
1-3 パッケージマネージャー(npm/yarn)
1-4 ECMAScript
1-5 モジュールバンドラー、トランスパイラ
1-6 SPA と従来のWeb システムの違い .. .
Chapter1 まとめ
Chapter2 モダンJavaScript の機能に触れる
2-1 const、let での変数宣言
2-2 テンプレート文字列
2-3 アロー関数 ( ) => { }
2-4 分割代入 { } [ ]
2-5 デフォルト値 =
2-6 スプレッド構文
2-7 オブジェクトの省略記法
2-8 map、filter
Chapter2 まとめ
Chapter3 JavaScript でのDOM 操作
3-1 JavaScript によるDOM アクセス
3-2 DOM の作成、追加、削除
3-3 JavaScript によるDOM 操作実践
Chapter3 まとめ
Chapter4 React の基本
4-1 React 開発の始め方
4-2 JSX 記法
4-3 コンポーネントの使い方
4-4 イベントやスタイルの扱い方
4-5 Props
4-6 State（useState）
4-7 再レンダリングと副作用（useEffect）
4-8 export の種類
Chapter4 まとめ
Chapter5 React とCSS
5-1 Inline Styles
5-2 CSS Modules
5-3 Styled JSX
5-4 styled components
5-5 Emotion
5-6 Tailwind CSS
Chapter5 まとめ
Chapter6 再レンダリングの仕組みと最適化
6-1 再レンダリングが起きる条件
6-2 レンダリング最適化1（memo）
6-3 レンダリング最適化2（useCallback）
6-4 変数のmemo 化（useMemo）
Chapter6 まとめ
Chapter7 グローバルなState 管理
7-1 グローバルなState 管理が必要な理由
7-2 Context でのState 管理
7-3 その他のグローバルstate を扱う方法
Chapter7 まとめ
Chapter8 React とTypeScript
8-1 TypeScript の基本
8-2 API で取得するデータへの型定義
8-3 Props への型定義
8-4 型定義の管理方法
8-5 コンポーネントの型定義
8-6 省略可能な型の定義
8-7 オプショナルチェイニング（Optional chaining）
8-8 ライブラリの型定義
Chapter8 まとめ
Chapter9 カスタムフック
9-1 カスタムフックとは
9-2 カスタムフックの雛形を作成
9-3 カスタムフックの実装
Chapter9 まとめ
付録 React × TypeScript 実践演習

Chapter1 React を始める前に知っておきたいモダンJavaScript の基礎
1-1 モダンJavaScript 概説
1-2 DOM、仮想DOM
1-3 パッケージマネージャー(npm/yarn)
1-4 ECMAScript
1-5 モジュールバンドラー、トランスパイラ
1-6 SPA と従来のWeb システムの違い .. .
Chapter1 まとめ
Chapter2 モダンJavaScript の機能に触れる
2-1 const、let での変数宣言
2-2 テンプレート文字列
2-3 アロー関数 ( ) => { }
2-4 分割代入 { } [ ]
2-5 デフォルト値 =
2-6 スプレッド構文
2-7 オブジェクトの省略記法
2-8 map、filter
Chapter2 まとめ
Chapter3 JavaScript でのDOM 操作
3-1 JavaScript によるDOM アクセス
3-2 DOM の作成、追加、削除
3-3 JavaScript によるDOM 操作実践
Chapter3 まとめ
Chapter4 React の基本
4-1 React 開発の始め方
4-2 JSX 記法
4-3 コンポーネントの使い方
4-4 イベントやスタイルの扱い方
4-5 Props
4-6 State（useState）
4-7 再レンダリングと副作用（useEffect）
4-8 export の種類
Chapter4 まとめ
Chapter5 React とCSS
5-1 Inline Styles
5-2 CSS Modules
5-3 Styled JSX
5-4 styled components
5-5 Emotion
5-6 Tailwind CSS
Chapter5 まとめ
Chapter6 再レンダリングの仕組みと最適化
6-1 再レンダリングが起きる条件
6-2 レンダリング最適化1（memo）
6-3 レンダリング最適化2（useCallback）
6-4 変数のmemo 化（useMemo）
Chapter6 まとめ
Chapter7 グローバルなState 管理
7-1 グローバルなState 管理が必要な理由
7-2 Context でのState 管理
7-3 その他のグローバルstate を扱う方法
Chapter7 まとめ
Chapter8 React とTypeScript
8-1 TypeScript の基本
8-2 API で取得するデータへの型定義
8-3 Props への型定義
8-4 型定義の管理方法
8-5 コンポーネントの型定義
8-6 省略可能な型の定義
8-7 オプショナルチェイニング（Optional chaining）
8-8 ライブラリの型定義
Chapter8 まとめ
Chapter9 カスタムフック
9-1 カスタムフックとは
9-2 カスタムフックの雛形を作成
9-3 カスタムフックの実装
Chapter9 まとめ
付録 React × TypeScript 実践演習

第１章　イントロダクション
第２章　基本的な文法・基本的な型
第３章　オブジェクトの基本とオブジェクトの型
第４章　ＴｙｐｅＳｃｒｉｔｐの関数
第５章　ＴｙｐｅＳｃｒｉｐｔのクラス
第６章　高度な型
第７章　ＴｙｐｅＳｃｒｉｐｔのモジュールシステム
第８章　非同期処理
第９章　ＴｙｐｅＳｃｒｉｐｔのコンパイラオプション
付録

鈴木僚太（スズキリョウタ）
２０１３年からＴｙｐｅＳｃｒｉｐｔを使用中。ＬＩＮＥ株式会社でフロントエンドエンジニアとして自社開発に従事しながら、技術顧問なども行っている（『プロを目指す人のためのＴｙｐｅＳｃｒｉｐｔ入門ー安全なコードの書き方から高度な型の使い方まで』発行当時）。専門はＴｙｐｅＳｃｒｉｐｔとＲｅａｃｔで、講演やインターネット上での記事公開を通じて初心者向けから上級者向けまでさまざまな情報を発信している。ＯＳＳ活動にも積極的だが自作のライブラリはあまり流行っていない（本データはこの書籍が刊行された当時に掲載されていたものです）

■第1章　［入門］グラフィックスプログラミング　……長く役立つ基礎の基礎
■■1.1　グラフィックスとグラフィックスプログラミングの基本　……CG、2D、3D、画素
■■■コンピューターグラフィックス　……コンピューターによって描き出されたグラフィックス
■■■2Dと3D　……グラフィックスの生成手順やデータ管理方法が違うだけ
■■■グラフィックスを構成するもの　……出力先は「画素」の集まり
■■■グラフィックスプログラミングの課題や目的　……画素をどう塗りつぶすか
■■1.2　グラフィックスプログラミングの分類　……活躍の舞台は広い
■■■情報を伝えるためのグラフィックス
■■■情報を正しく理解するためのグラフィックス
■■■エンターテイメントとしてのグラフィックス
■■■アートとしてのグラフィックス
■■1.3　グラフィックスプログラミングと技術　……原則、プログラミング言語、API
■■■グラフィックスプログラミングの原則
■■■グラフィックスプログラミングと、プログラミング言語＆ツール　……手軽にグラフィックスを生成する選択肢
■■■■Processingでできること
■■■■ゲームエンジンから学び始める
■■■■ツールと基礎/原理の学習
■■■グラフィックスAPI　……DirectX、OpenGL、OpenGL ES
■■■■［まとめ］DirectXとOpenGLの特徴
■■■グラフィックスAPIを利用するアプリケーション
●Column　Metal、Vulkan　……AppleとKhronos Groupのその他のグラフィックスAPI
■■■Webとグラフィックス　……JavaScriptと動的なグラフィックス生成機能
■■■JavaScriptとWebブラウザによる効率的な学習の実現
■■■JavaScriptのメリットを活かす　……本書の構成と解説の流れ
■■1.4　本章のまとめ
■第2章　［グラフィックスプログラミングで役立つ］JavaScript/ES2015入門　……開発環境から文法基礎まで
■■2.1　本書における開発言語と開発環境　……JavaScript、Chrome、Windows＆macOS
■■■サンプルの実行環境　……Google Chrome
■■■開発環境とテキストエディタ
■■■Webとアプリケーション
■■■■クライアントサイドとサーバーサイド
■■■JavaScriptとECMAScript
●Column　ECMAScript規格とWebブラウザの実装の関係
■■■JavaScriptの進化と、グラフィックスプログラミング
■■2.2　サンプルと実行環境について　……ファイル構成、ブラウザ＆開発ツール
■■■サンプルの構成と実行方法
■■■Chromeの開発者ツールの基本　……JavaScriptのデバッグ準備
■■■開発者ツールのパネル＆JavaScriptのデバッグ
■■■■Elementパネル　……HTMLドキュメントの構造を確認
■■■■Sourcesパネル　……JavaScriptプログラムの実行制御をデバッグに活用
■■■■Consoleパネル　……JavaScriptのインラインコードの実行結果を確認できる
■■■コメントとJSDoc　……サンプルに含まれるコメントの読み方
■■2.3　［グラフィックスプログラミングのための］JavaScript/ES2015の基本　……基本操作、変数、関数、オブジェクト、演算子
■■■アラートやコンソールの活用
■■■変数　……変数名、キーワード、基本的な規約
■■■変数宣言キーワードとスコープ
■■■■ローカルスコープ、グローバルスコープ
■■■■var　……スコープは関数内部限定
■■■■let　……スコープは関数内部とブロック内部
■■■■const　……スコープは関数内部とブロック内部。再代入が行えない
■■■JavaScriptのデータ型
■■■変数の動的型付け　……JavaScriptでは変数自身は型を持たない
●Column　変数宣言キーワードの取捨選択
■■■■動的型付けの言語で気をつけたいこと
●Column　null、undefined、Symbol
■■■関数　……名前付きの関数の定義と呼び出し、関数の戻り値
■■■関数式　……文と式
■■■■関数式による関数の定義と呼び出し
■■■■無名関数
■■■■アロー関数
●Column　関数の引数と既定値
■■■■関数式と関数の引数
●Column　非同期処理とコールバック関数
●Column　JavaScriptと「自動セミコロン挿入」機能
■■■オブジェクト型　……JavaScriptではプリミティブなデータ以外、すべてがオブジェクト型
■■■配列　……データをまとめて格納できる。（グラフィックス）プログラミングで頻出のオブジェクト
■■■■配列の要素へのアクセス　……インデックスを指定
■■■オブジェクト　……多種多様なオブジェクトで成り立つJavaScript
■■■■オブジェクトの構造
■■■■オブジェクトの要素へのアクセス
●Column　プロパティとメソッド
●Column　ビルトインオブジェクトとプロトタイプチェーン
■■■制御構文　……条件や繰り返し。ロジックを記述する
■■■■if文　……ある条件に一致した場合＆しなかった場合、処理へ進む
■■■■for文　……カウンター変数を用いて繰り返し処理を行う
●Column　JavaScriptの真偽値判定
■■■■while文　……柔軟な継続条件で繰り返し処理を行う
●Column　無限ループ
■■■■switch文　……特定の条件に応じた分岐処理
■■■演算子　……算術、代入、比較、論理、条件
■■■■算術演算子　……四則演算、剰余
■■■■インクリメント演算子、デクリメント演算子　……接頭辞と接尾辞に注意
■■■■代入演算子　……変数に値を代入
■■■■比較演算子　……原則として厳密比較を使用
■■■■論理演算子　……&&（AND）、||（OR）
■■■■条件演算子　……条件に合わせて異なる値を用いたい場合
■■2.4　本章のまとめ
●Column　条件演算子とif文
■第3章　［基礎］グラフィックスプログラミングと数学　……三角関数、線型代数、乱数＆補間
■■3.1　角度と三角関数　……ラジアン、sin（サイン）、cos（コサイン）
■■■ラジアン　……弧度
■■■■角度の表現　……度数法と弧度法
■■■■プログラミングと角度　……ラジアンで考える
●Column　ラジアンの捉え方
■■■グラフィックスプログラミングのためのsin、cos　……ラジアン、半径1の円とともに
●Column　グラフィックスプログラミングで大活躍（!?）の三角関数
■■3.2　ベクトルと行列　……点から始める線型代数
■■■ベクトルとスカラー　……量と向き
■■■原点とベクトルの始点と終点　……点を結ぶ
■■■ベクトルの向き　……単位化、単位ベクトル、（再び）半径1の円
●Column　座標とベクトル　……配列[x, y]は座標なのか、ベクトルなのか
■■■ベクトルと演算　……加算、減算
●Column　単位化、正規化、規格化、標準化　……単位化と同様の意味で使われる言葉？
■■■ベクトルのスカラー倍
■■■ベクトルの内積、外積
■■■■内積　……内積はベクトルAとベクトルBの成す角θに対するコサイン
●Column　ベクトルのスカラー倍で速度が変わる
■■■■外積　……外積はベクトルAとベクトルBの成す角θに対するサイン
●Column　ベクトルの内積と外積の使いどころ
■■■行列　……ベクトルの変形や変換
■■■■回転行列　……ベクトルを回転させる
■■3.3　乱数/擬似乱数と補間＆イージング　……グラフィックスプログラミングに役立つ数学関連知識
■■■乱数と擬似乱数　……ランダムな状態と擬似乱数の品質
■■■■JavaScriptと乱数（擬似乱数）　……Chrome/V8のXorshift
■■■補間とイージング　……滑らかさや緩やかさの変化の表現
■■3.4　本章のまとめ
●Column　あらゆる場面で活躍する補間関数
●Column　擬似乱数とシード値
■第4章　Canvas2Dから学べる基本　……Canvas2Dコンテキストと描画命令
■■4.1　Canvas2Dの基礎知識　……コンテキストオブジェクト、Document Object Model
■■■HTML5とCanvas、Canvas API　……ほとんどのブラウザはCanvasに対応
■■■コンテキストオブジェクト　……描画処理のための機能と設定を持つオブジェクト
■■■Canvas2Dコンテキストの取得　……CanvasRenderingContext2D
■■■HTML要素としてのCanvas　……Canvas要素にはCSSによる余分な装飾は極力行わない
●Column　コンテキストの種類
●Column　RetinaディスプレイとCanvas要素の大きさ　……CSSサイズ、物理サイズ
■■■Document Object Model　……Canvas要素をはじめ、HTML要素をJavaScriptから参照する
■■4.2　Canvas2Dの基本プリミティブ　……矩形、線、多角形、円、円弧、ベジェ曲線...
■■■矩形の描画　……fillRect
■■■塗りつぶしと線のスタイル　……fillStyle、strokeStyle
■■■［予習］Canvas2Dサンプルの構成と動作確認
■■■■サンプルの実行　……HTMLファイルをダブルクリック
■■■■スクリプトファイルの読み込み　……<script>タグ
●Column　CSSのrgb関数とrgba関数
■■■■即時関数を使って全体を囲う
■■■■読み完了タイミングの検出　……addEventListenerとloadイベント
■■■■初期化処理　……loadイベント後?
■■■■描画処理　……loadイベント後?
●Column　addEventListenerの第3引数の意味
●Column　即時関数と無名関数
■■■■［まとめ］本書サンプルの基本構成のポイント
■■■処理の役割に応じた関数化　……シンプルな役割
■■■線分（ライン）の描画　……Canvas2Dコンテキストではパスを利用
■■■■サブパス　……パスを区切る仕組み
■■■■パス＆サブパスを使ったラインの描画
■■■■［まとめ］Canvas2Dコンテキストでパスを用いた描画の流れ
■■■パスを利用した多角形の描画　……一筆書きで座標を連続でつなぐ
■■■ランダムに変化する多角形の描画
■■■円の描画　……円や円弧の描画もパスを利用
■■■円弧の描画　……乱数によってランダムに変化する円弧の例
●Column　arcメソッドの第6引数
■■■ベジェ曲線　……2次ベジェ曲線、3次ベジェ曲線、複雑な曲線を描画する
●Column　パスを閉じずに描く　……closePath、stroke
■■■画像を利用した描画　……読み込みの待機にaddEventListener（再び）
■■4.3　Canvas2Dコンテキストの描画効果＆演出機能　……テキスト、ドロップシャドウ、グラデーション、パターン、アルファブレンディング、コンポジットオペレーション
■■■テキストの描画　……グラフィックスとしてテキストを描く
■■■ドロップシャドウの描画　……一様に設定内容が反映される点には注意
●Column　文字列のfillとstroke
■■■グラデーションとパターン　……まずは効果を適用する実体のオブジェクトを生成
■■■■グラデーション　……線形グラデーション、円形グラデーション
■■■■パターン　……repeat、repeat-x、repeat-y、no-repeat
■■■アルファブレンディング　……アルファ値で、透明や半透明の描画処理
■■■コンポジットオペレーション　……さまざまな合成の種類
■■■■コンポジットオペエレーションの設定
■■4.4　本章のまとめ



■第5章　ユーザーインタラクションのプログラミング　……ゼロから作るシューティングゲーム?
■■5.1　［まずは準備から］シューティングゲームを作る　……ファイル構成とルール
■■■なぜ、ゲーム作り？　……種々の関連技術の集合体で、小さなゴールを設定しやすい
■■■作成するゲームのファイル構成
■■■作成するゲームの枠組み　……最低限のルールの定義
■■5.2　ゲームの骨格を作る　……土台となるプログラムの設計
■■■HTMLページとしての構造　……ゲームの舞台となるCanvas要素のための設定
■■■class構文　……独自の機能や属性を持つクラスを定義できる
●Column　loadイベントとDOMContentLoadedイベント
■■■■クラス再入門　……クラスの概念を持つ言語、持たない言語
■■■■プロトタイプとクラス　……JavaScriptにクラスは存在しない
■■■■［まとめ］クラスベースとプロトタイプベース
■■■■プロトタイプベースの言語の記述と振る舞い　……prototype、new演算子、コンストラクタ関数
■■■■class構文の使い方　……プロトタイプの記述をわかりやすくする
●Column　プロトタイプは拡張できる　……ただし、注意点も
■■■canvas2d.jsに記述したCanvas2DUtilityオブジェクト　……class構文で定義
■■■■コンストラクタ関数でインスタンスを生成できるオブジェクト　……便宜上の「クラス」
■■■■constructor（コンストラクタ）
■■■■property（プロパティ）
■■■■propertyとgetter（プロパティとゲッター）　……プロパティを取得する際に関数を実行したい
●Column　setter（セッター）　……プロパティを設定する際に関数を実行したい
■■■■method（メソッド）　……オブジェクトが持っている関数
●Column　プロトタイプを用いるメリット　……プロトタイプチェーン
■■■script.jsに記述されたメインプログラム　……シューティングゲーム作成のひな形
■■■メインループ　……アニメーション処理のための基盤を実装
■■■■タイムスタンプの格納と取得
■■■■描画処理　……塗りつぶし、経過時間の計測、画像の描画、描画処理の再帰呼び出し
■■■ユーザーインタラクション　……ユーザーの入力とaddEventListener
●Column　キー入力系イベントの発生順序とリピート
■■■シーン構成を整える　……各種シーンの状態管理の基盤
■■5.3　本章のまとめ



■第6章　キャラクターと動きのプログラミング　……ゼロから作るシューティングゲーム?
■■6.1　キャラクターの実装　……キャラクター管理クラス、キーの入力によるインタラクティブな移動
■■■クラスの抽象化　……共通して必要となるパラメーターをまとめて管理
■■■■Positionクラス　……座標を管理するためのクラス
●Column　コンストラクタによる値の代入
■■■■Characterクラス　……キャラクターのベースとなる汎用的なクラス
■■■■クラスの継承と自機キャラクタークラス　……class構文のextendsと、super
■■■自機キャラクタークラスを利用したメインプログラム
■■■クラスに特有の処理を一元管理する
■■■キャラクターの幅を考慮した描画
■■■キャラクターの移動をなめらかに行う
■■■■windowオブジェクトへのプロパティ追加
●Column　キャラクターの中心　……3Dでも活かせる座標を意識する感覚
■■■■オブジェクトのプロパティへのアクセス　……ドット記法とブラケット記法
■■■■テンプレートリテラル
■■■■ブラケット記法とテンプレートリテラルを組み合わせる
■■■画面の外に出ないように制限する　……画面の端の判定と座標の補正
●Column　速度をspeedというプロパティに置き換えた意味
■■6.2　ショットの実装　……大量ショットのインスタンス、程良い速度、回転描画
■■■ショットはキャラクターの一種　……Characterクラスを継承してShotクラス
■■■キャラクターからショットを放つ　……Characterクラス、Shotクラス、Viperクラス
■■■ショットのことを踏まえた初期化処理　……大量のショットのインスタンスを扱う
■■■ロードの完了と描画処理
■■■■render関数の呼び出し
■■■ショットが高速に生成されることを防ぐ　……密生するショットの原因と対策
●Column　setTimeoutとsetInterval
■■■ショットの進行方向を設定可能にする
■■■異なる種類のショットを同時に放てるようにする
■■■ショットを回転させて描画する
■■■■Canvas2Dコンテキストにおける回転表現
■■■■原点を意識して回転処理を行う
■■■■Canvas2Dコンテキストの状態保存と状態復元
■■■■その他の変更点
●Column　Math.PI * 1.5の意味するもの
■■6.3　敵キャラクターの実装　……敵キャラクターの配置、シーン管理＆更新、敵キャラクターのタイプ
●Column　サイン、コサインで作るベクトルは常に単位ベクトル
■■■敵キャラクターのためのクラスを実装する
■■■「シーン」という概念　……SceneManagerクラス
■■■シーン管理クラスの利用とシーン更新用の関数
■■■■［まとめ］シーン関連の変更点
■■■連続して敵キャラクターが出現するシーン
■■■キャラクターに「タイプ」の概念を追加する
■■6.4　本章のまとめ



■第7章　状態に応じた判定や演出のプログラミング　……ゼロから作るシューティングゲーム?
■■7.1　衝突判定　……オブジェクト同士の衝突、エフェクト、補間関数/イージング関数
■■■衝突を判定するロジック　……形状に応じた判定の基本
■■■■矩形との衝突判定の注意点
■■■ベクトルを利用した衝突判定　……ベクトルの長さを測る方法の応用
■■■Positionクラスの拡張　……2つの座標間の距離を計測
■■■自機キャラクターのショットと敵との衝突判定　……攻撃力とライフ
●Column　キャラクターのサイズ
■■■破壊を演出する　……爆発エフェクト
■■■■Explosionクラス
■■■爆発エフェクトの質感を向上する　……ランダム要素を取り入れる
■■■補間関数で減衰するような動きを表現　……より自然な変化
■■7.2　自機キャラクターの状態に応じた処理　……ライフの減算、ゲームオーバーの演出、再スタート
■■■自機キャラクターと敵ショットとの衝突判定　……敵キャラクターの攻撃
■■■ゲームオーバーの演出とゲームの再スタート　……ゲームの終わり。しかし、実装と演出は続く...
■■7.3　ゲームの品質向上　……スコア、敵キャラの攻撃力＆耐久力、シーン管理、背景、音声、ボスキャラ
■■■スコアを集計して表示する
●Column　String.padStartメソッド
■■■敵キャラクターのバリエーションを増やす
■■■■自機狙い弾を放つ敵キャラクター
■■■■耐久力の高い敵キャラクター
■■■■シーン管理の見直し　……よりゲームらしく
■■■背景を追加する　……ゲームの舞台を表現する演出
■■■効果音を再生する　……シーンの雰囲気を底上げする演出
■■■■ユーザーの操作を受けてから初期化処理を行う
■■■■音声データを扱う自作クラスを実装する　……Soundクラス
■■■■Promiseと非同期処理
■■■■AudioContextによる音声データの再生
●Column　コールバック関数とPromise
●Column　JavaScriptとガベージコレクタ
■■■［いよいよ最終仕上げへ］ボスキャラクターやホーミングショットの実装に挑戦！
■■■■ボスキャラクター本体の実装　……キャラクター自身が「モード」を持つ
■■■■ホーミングショットの実装　……内積＆外積の知識をフル活用
●Column　プログラミングと数学や物理
■■7.4　本章のまとめ



■第8章　ピクセルと色のプログラミング　ピクセルを塗る操作と感覚
■■8.1　［再入門］グラフィックスを構成するピクセル　……ピクセルと画像処理
■■■そもそもピクセルとは何か？　……グラフィックスを構成する最小の単位
■■■ピクセルを操作する画像処理　……ある意味ではグラフィックスプログラミングの本質
●Column　ペイントソフトは画像処理の宝庫
■■8.2　Canvas APIでピクセルを直接操作する　……ピクセル操作の窓口「ImageData」
■■■［基礎知識］同一生成元ポリシー　……ローカル環境とWebブラウザのセキュリティ
■■■ローカルサーバーを起動してファイルをプレビューする
■■■Chromeの拡張機能を利用したローカルサーバーの起動　……Web Server for Chrome
●Column　（比較的簡単な）その他のローカルサーバー起動方法
■■■ImageDataオブジェクト　……Canvas要素のピクセルを操作する窓口
■■■TypedArray　……数値を効率良く扱える型付き配列
■■■■Uint8ClampedArray形式　……値がクランプされる特殊な形式
●Column　JavaScriptとバイナリデータ　……TypedArray
■■■ピクセルの並び順とデータ構造　……ImageDataを利用したピクセル情報の抜き出し
■■8.3　画像処理プログラミングの基本テクニック　……ネガポジ反転、グレースケール、2値化、エッジ検出、ノイズ除去、モザイク
■■■ネガポジ反転
■■■グレースケール　……色の鮮やかさと引き換えに。白～灰色～黒の明暗を得る
■■■2値化　……白か黒か。色が二択
●Column　意外にも奥が深い（!?）グレースケールの世界
■■■エッジ検出　……色差分を可視化するラプラシアンフィルター
■■■ノイズ除去　……メディアンフィルターで極端に色が異なるピクセルを除去する
●Column　上下左右だけでなく、斜め方向も加えたラプラシアンフィルター
●Column　メディアンフィルターを繰り返し実行する
■■■モザイク　……ピクセルの大きさを変化させる
■■8.4　本章のまとめ