1　淺嚐JavaScript
JavaScript的運作方式
你要如何編寫JavaScript
如何將JavaScript放入你的頁面
如何撰寫一個述句（statement）
變數（variables）與值（values）
常數（constants），另一種變數
重複執行任務
while迴圈如何運作
使用JavaScript做決定
接觸使用者並與他們溝通
仔細檢視console.log
開啟主控台（console）
編寫一個實際的JavaScript應用程式
如何在我的頁面中加入程式碼？

2　撰寫真實程式碼：繼續深入讓我們打造一個戰艦（Battleship）遊戲
首先是高階的設計
逐步解析虛擬程式碼（pseudocode）
在我們繼續之前，別忘了HTML！
撰寫Simple Battleship的程式碼
現在我們來編寫遊戲邏輯
做一點品質管控（quality assurance）
完成Simple Battleship遊戲
產生隨機數字（random number）的步驟
恭喜你完成第一個真正的JavaScript程式，並簡短談談程式碼的重複使用

3　函式介紹：邁向函式化之路這段程式碼到底有什麼問題？
你可以傳入什麼給函式？
JavaScript是藉由值傳遞（pass-by-value）的
奇怪的函式
函式也能回傳東西
追蹤帶有return述句的函式
全域（global）變數和區域（local）變數
了解區域和全域變數的範疇（scope）
別忘了宣告你的區域變數！
變數的短暫生命

4　資料排排站：
你能幫助Bubbles-R-Us泡泡公司嗎？
如何在JavaScript中表示多個值
陣列如何運作
Phrase-O-Matic片語產生器
回到Bubbles-R-Us...
迭代陣列還有一種更好的方法
使用後置遞增運算子（post-increment operator）重製for迴圈
從頭建立陣列（並為之添加東西）
快速瀏覽一下程式碼
撰寫printAndGetHighScore函式
使用printAndGetHighScore重構（refactor）程式碼
全部整合在一起

5　了解物件：物件村之旅
思考特性（properties）...
如何建立物件
到底什麼是「物件導向」？
特性如何運作
變數如何存放物件？好奇的人想知道...
比較原始型別值（primitives）與物件
使用物件做到更多事
這輛計程車符合資格嗎？
讓我們再談談如何將物件傳給函式
Auto-O-Matic
如何為你的物件添加行為（behavior）
改善drive方法
為什麼drive方法不知道started特性？
「this」如何運作
方法簡寫（method shorthand）
行為如何影響狀態（state）
現在讓我們用狀態影響行為
恭喜你完成第一個物件！

6　與網頁互動：認識DOM
JavaScript實際上是如何與你頁面互動的
如何製作你自己的DOM
初嚐DOM
使用getElementById獲取元素
我究竟從DOM得到了什麼？
尋找你內在的HTML
更改DOM時會發生什麼事
在頁面完全載入之前，別想執行我的程式碼！
你說「事件處理器（event handler）」，我說「回呼（callback）」
如何使用setAttribute設定屬性（attribute）
屬性的更多樂趣！
那麼DOM還有什麼用呢？

7　型別、相等性、轉換，以及那些有的沒的：認真的型別
小心，你可能意外碰到undefined...
如何使用null
處理NaN
了解相等性運算子（又稱為==）
相等性如何轉換其運算元
如何得到更嚴格的相等性
更多的型別轉換
如何判斷兩個物件是否相等
truthy就在眼前...
JavaScript會將什麼視為falsey
字串的祕密生活
字串如何能夠同時像是原始型別值（primitive）和物件
範本字面值（template literals）如何運作
字串之特性與方法的五分鐘導覽
椅子爭奪戰

8　全面整合：建造一個App
建立一個真正的戰艦遊戲
回到HTML和CSS
建立HTML頁面：整體全貌
新增一些樣式（style）
使用hit和miss類別
設計遊戲
實作視圖（view）
模型（model）
你需要一艘更大的船...和遊戲棋盤
實作控制器（controller）
處理玩家的猜測
取得玩家的猜測
如何放置船艦
恭喜，是時候創業了

9　處理事件：進入非同步世界
何謂事件？
何謂事件處理器（event handler）？
建立事件處理器
透過製作遊戲來了解事件...
實作遊戲
讓我們加入更多影像
如何為所有影像重複使用相同的處理器
事件物件（event object）如何運作
讓事件物件發揮作用
事件和佇列（queues）
setTimeout如何運作
完成影像遊戲

10　匿名函式與高階函式：解放函式
function關鍵字神祕的雙重身分
如果函式是值，我們就能把它們指定給變數
看看函式的另一面...
如何使用匿名函式（anonymous function）
我們可以使用箭號函式（arrow functions）讓程式碼更簡短
建立箭號函式
Webville Cola
了解陣列的sort方法
回到Webville Cola
介紹高階函式（higher-order functions）
使用高階函式進行過濾
別忘了你的匿名和箭號函式
使用reduce得到總銷售箱數
鏈串map、filter和reduce
以forEach進行迭代

11　現代語法、語彙範疇與closure：函式真功夫
認真研究函式語法
分散你的引數
關於函式有些事情我們還沒告訴你...
函式宣告會被「拉升（hoisted）」
我們已經完成函式宣告，現在要做的是其他的事情
我們需要談談範疇
讓函式超越全域範疇
溫習語彙範疇（lexical scope）
再次看看我們的外層（outer）和內層（inner）函式
使用範疇進行封裝（encapsulation）
兩條重要的JavaScript範疇規則
如何製作一個closure
使用closure實作魔法計數器（magic counter）
使用closure實作計數器
makeTimer的運作方式
實作onlyOnceMaker

12　進階的物件建構：創造物件
使用物件字面值建立物件
使用物件的慣例
介紹類別
如何定義類別
如何從類別建立出物件
類別的運作方式
讓我們加入一些方法
生產的時間到了！
基本的Car類別
使用extends實作Taxi類別
新增方法到Taxi類別
實作RocketCar類別
使用物件字面值來整理我們的建構器
改造Car建構器
存取器（accessor）特性
使用取值器（getter）
若無設值器（setter），取值器又有何用？
靜態特性和方法
計算我們的車子產量

A　漏網之魚：十大遺珠之憾
#1 模組（modules）
#2 JSON
#3 Promise（承諾）
#4 解構指定（destructuring assignment）
#5 Symbol（符號）和BigInt（大整數）
#6 Map（映射）與Set（集合）
#7 使用DOM執行更多操作
#8 window物件
#9 伺服端（server-side）JavaScript
#10 遞迴（recursion）