第一篇　潛龍勿用
第1章　創(chuàng)建小游戲項目　　2
第1課　創(chuàng)建項目　　2
了解小游戲的雙線程運行機制　　2
注冊開發(fā)者賬號　　4
安裝微信開發(fā)者工具　　5
創(chuàng)建第一個小游戲項目　　6
項目測試：本地預覽與手機預覽　　7
基于文件監(jiān)聽實現(xiàn)自動預覽　　8
了解小游戲示例項目的項目結構　　11
小游戲如何調試代碼　　13
拓展：如何安裝、配置 Node.js和
babel-node　　17
了解面向對象編程有關的基本
概念　　18
本課小結　　20
第2課　微信小游戲是如何運行的　　21
創(chuàng)建畫布　　21
拓展：如何給變量命名　　22
如何繪制矩形　　23
拓展：如何理解小游戲的全局變量及
作用域　　24
如何清空畫布　　25
如何繪制網(wǎng)絡圖片　　25
如何在小游戲中實現(xiàn)動畫　　28
如何實現(xiàn)人機交互　　29
拓展：如何理解局部變量　　30
拓展：了解微信小游戲的API
風格　　31
本課小結　　32
第二篇　見龍在田
第2章　編寫一個簡單的HTML5
小游戲：打造游戲界面　　34
第3課　繪制游戲標題　　35
安裝與配置Visual Studio Code　　35
學習使用HTML標記，開始繪制游戲標題　　36
拓展：如何使用const 關鍵字　　39
拓展：如何給代碼添加注釋　　40
如何改變字體、字號和顏色　　40
拓展：在font-family中要使用中文字體的英文名稱　　42
如何給文本添加文本樣式　　42
如何在繪制文本中使用漸變色　　44
如何讓文本居中繪制　　46
拓展：為什么要在代碼中使用
常量　　48
本課小結　　48
第4課　繪制擋板　　48
如何在畫布上繪制直線　　48
拓展：JS的8個基本數(shù)據(jù)類型，如何進行類型判斷　　50
給畫布添加一個淺色背景　　53
如何加厚擋板　　54
拓展：JS中的數(shù)值類型、布爾類型是如何進行類型轉換的　　55
如何給擋板添加圓角、陰影效果　　56
使用路徑填充和矩形繪制擋板　　58
如何使用顏色漸變對象和圖像填充材質繪制擋板　　60
拓展：什么是區(qū)塊作用域　　65
拓展：了解數(shù)字類型，警惕0.1 + 0.2不等于0.3　　66
拓展：如何批量聲明變量、常量　　67
本課小結　　67
第5課　繪制小球　　68
如何使用弧線繪制圓形　　 68
如何使用arc方法直接繪制圓形　　70
本課小結　　71
第6課　繪制分界線　　71
分別通過lineTo和漸變色繪制
分界線　　71
拓展：CSS 顏色值有哪些格式　　73
使用函數(shù)繪制間隔效果　　75
拓展：如何定義和使用函數(shù)　　77
使用循環(huán)繪制分界線　　81
拓展：使用比較運算符、if控制語句
和算術運算符　　84
拓展：JS的5種循環(huán)控制語句　　86
將函數(shù)當作變量使用　　87
拓展：如何理解JS的作用域鏈與
閉包　　90
拓展：如何使用集合對象 Map 與
Set　　92
本課小結　　95
第3章　編寫一個簡單的HTML5小游戲：完成交互功能　　96
第7課　實現(xiàn)動畫：讓小球動起來　　96
使用定時器實現(xiàn)動畫　　96
拓展：如何理解JS的異步執(zhí)行
機制　　98
拓展：了解13種復合賦值運算符　　99
完成動畫的關鍵：清屏　　99
如何實現(xiàn)小球與屏幕的碰撞
檢測　　103
拓展：復習使用if else if 語句　　105
使用 requestAnimationFrame改進動畫流暢度　　106
本課小結　　108
第8課　監(jiān)聽用戶事件：讓擋板動
起來　　108
繪制左擋板　　108
使右擋板可以上下自主移動　　110
改用函數(shù)繪制擋板　　111
監(jiān)聽用戶輸入，使用鼠標（或觸摸）
事件操控左擋板　　112
實現(xiàn)擋板與球的碰撞檢測　　114
拓展：如何使用邏輯運算符　　115
統(tǒng)計分數(shù)　　116
拓展：復習批量聲明變量，可以將
逗號放在前面　　117
在游戲結束時添加反饋　　118
拓展：加號與模板字符串　　120
本課小結　　121
第9課　實現(xiàn)游戲的重啟功能　　122
繪制重新開始游戲的文本提示　　122
理解HTML5的事件模型，監(jiān)聽單擊
事件實現(xiàn)重啟功能　　123
拓展：如何使用removeEvent---
Listener　　127
本課小結　　128
第10課　控制游戲音效：添加單擊
音效和背景音樂　　128
如何使用