目錄

第 1部分　熱身

第 1章 無處不在的

JavaScript　3

1.1 “理解”JavaScript語言　4

1.1.1 JavaScript是如何發展

的　5

1.1.2 如今的轉換編譯器已經能

讓我們體驗未來的

JavaScript　6

1.2 理解瀏覽器　6

1.3 使用當前的*佳實踐　7

1.3.1 調試　8

1.3.2 測試　8

1.3.3 性能分析　9

1.4 提高跨平臺開發能力　10

1.5 小結　11

第2章 運行時的頁面構建

過程　13

2.1 生命周期概覽　14

2.2 頁面構建階段　17

2.2.1 HTML解析和DOM

構建　18

2.2.2 執行JavaScript代碼　19

2.3 事件處理　23

2.3.1　事件處理器概覽 23

2.3.2 注冊事件處理器　25

2.3.3 處理事件　26

2.4 小結　28

2.5 練習　29



第2部分　理解函數



第3章 新手的**堂函數

課：定義與參數　33

3.1 函數式的不同點到底是什么　34

3.1.1 函數是**類對象　35

3.1.2 回調函數　36

3.2 函數作為對象的樂趣　39

3.2.1 存儲函數　40

3.2.2 自記憶函數　41

3.3 函數定義　43

3.3.1 函數聲明和函數表達

式　44

3.3.2 箭頭函數　48

3.4 函數的實參和形參　50

3.4.1 剩余參數　52

3.4.2 默認參數　53

3.5 小結　56

3.6 練習　57



第4章 函數進階：理解函數

調用　59

4.1 使用隱式函數參數　60

4.1.1 arguments參數　60

4.1.2 this參數：函數上下文　65

4.2 函數調用　65

4.2.1 作為函數直接被

調用　66

4.2.2 作為方法被調用　67

4.2.3 作為構造函數調用　70

4.2.4 使用apply和call方法

調用　75

4.3 解決函數上下文的

問題　81

4.3.1 使用箭頭函數繞過函數上下文　81

4.3.2 使用bind方法　85

4.4 小結　86

4.5 練習　86

第5章 精通函數：閉包和

作用域　89

5.1 理解閉包　90

5.2 使用閉包　93

5.2.1 封裝私有變量　93

5.2.2 回調函數　95

5.3 通過執行上下文來跟蹤

代碼　98

5.4 使用詞法環境跟蹤變量的作用域　101

5.4.1 代碼嵌套　101

5.4.2 代碼嵌套與詞法環境　102

5.5 理解JavaScript的變量

類型　104

5.5.1 變量可變性　104

5.5.2 定義變量的關鍵字與詞法環境　107

5.5.3 在詞法環境中注冊標

識符　111

5.6 研究閉包的工作

原理　114

5.6.1 回顧使用閉包模擬私有變量的代碼　115

5.6.2 私有變量的警告　118

5.6.3 回顧閉包和回調函數的

例子　119

5.7 小結　122

5.8 練習　122

第6章 未來的函數：生成器和

promise　125

6.1 使用生成器和promise編寫優雅的異步代碼　126

6.2 使用生成器函數　127

6.2.1 通過迭代器對象控制

生成器　129

6.2.2 使用生成器　133

6.2.3 與生成器交互　136

6.2.4 探索生成器內部

構成　139

6.3 使用promise　145

6.3.1 理解簡單回調函數所帶來的問題　146

6.3.2 深入研究promise　149

6.3.3 拒絕promise　151

6.3.4 創建**個真實promise

案例　153

6.3.5 鏈式調用promise　155

6.3.6 等待多個promise　156

6.3.7 promise競賽　156

6.4 把生成器和promise相

結合　157

6.5 小結　161

6.6 練習　161



第3部分　深入鉆研對象，強化代碼



第7章 面向對象與原型　167

7.1 理解原型　168

7.2 對象構造器與原型　171

7.2.1 實例屬性　173

7.2.2 JavaScript動態特性的副作用　176

7.2.3 通過構造函數實現對象類型　179

7.3 實現繼承　180

7.3.1 重寫constructor屬性的

問題　184

7.3.2 instanceof操作符　187

7.4 在ES6使用JavaScript的class　189

7.4.1 使用關鍵字class　190

7.4.2 實現繼承　193

7.5 小結　195

7.6 練習　196

第8章 控制對象的訪問　199

8.1 使用getter與setter控制屬性訪問　200

8.1.1 定義getter和setter　201

8.1.2 使用getter與setter校驗屬性值　207

8.1.3 使用getter與setter定義如何計算屬性值　208

8.2 使用代理控制訪問　210

8.2.1 使用代理記錄日志　213

8.2.2 使用代理檢測性能　215

8.2.3 使用代理自動填充

屬性　216

8.2.4 使用代理實現負數組

索引　218

8.2.5 代理的性能消耗　220

8.3 小結　221

8.4 練習　222

第9章 處理集合　225

9.1 數組　225

9.1.1 創建數組　226

9.1.2 在數組兩端添加、刪除

元素　228

9.1.3 在數組任意位置添加、刪除元素　230

9.1.4 數組常用操作　232

9.1.5 復用內置的數組函數　243

9.2 Map　244

9.2.1 別把對象當做Map　245

9.2.2 創建map　248

9.2.3 遍歷map　250

9.3 Set　251

9.3.1 創建Set　253

9.3.2 并集　254

9.3.3 交集　255

9.3.4 差集　256

9.4 小結　256

9.5 練習　257

第10章 正則表達式　259

10.1 為什么需要正則

表達式　260

10.2 正則表達式進階　261

10.2.1 正則表達式說明　261

10.2.2 術語和操作符　262

10.3 編譯正則表達式　266

10.4 捕獲匹配的片段　268

10.4.1 執行簡單捕獲　268

10.4.2 使用全局表達式進行

匹配　270

10.4.3 捕獲的引用　271

10.4.4 未捕獲的分組　272

10.5 利用函數進行替換　273

10.6 使用正則表達式解決常

見的問題　275

10.6.1 匹配換行　275

10.6.2 匹配Unicode字符　276

10.6.3 匹配轉義字符　276

10.7 小結　277

10.8 練習　278

第11章 代碼模塊化　281

11.1 在JavaScript ES6之前的

版本中模塊化代碼　282

11.1.1 使用對象、閉包和立即執

行函數實現模塊　282

11.1.2 使用AMD和CommonJS

模塊化JavaScript

應用　289

11.2 ES6模塊　291

11.3 小結　297

11.4 練習　298



第4部分　洞悉瀏覽器



第12章 DOM操作　303

12.1 向DOM中注入

HTML　304

12.1.1 將HTML字符串轉換

成DOM　305

12.1.2 將DOM元素插入到文檔

中　309

12.2 DOM的特性和

屬性　311

12.3 令人頭疼的樣式

特性　313

12.3.1 樣式在何處　314

12.3.2 樣式屬性命名　316

12.3.3 獲取計算后樣式　317

12.3.4 轉換像素值　320

12.3.5 測量元素的高度和

寬度　321

12.4 避免布局抖動　326

12.5 小結　328

12.6 練習　329

第13章 歷久彌新的事件　331

13.1 深入事件循環　332

13.1.1 僅含宏任務的示例　335

13.1.2 同時含有宏任務和微任務

的示例　338

13.2 玩轉計時器：延遲執行和

間隔執行　342

13.2.1 在事件循環中執行計

時器　343

13.2.2 處理計算復雜度高的

任務　348

13.3 處理事件　351

13.3.1 通過DOM代理事件　352

13.3.2 自定義事件　358

13.4 小結　361

13.5 練習　362

第14章 跨瀏覽器開發

技巧　365

14.1 跨瀏覽器注意事項　366

14.2 五大開發問題　368

14.2.1 瀏覽器的bug和

差異　369

14.2.2 瀏覽器的bug修復　369

14.2.3 外部代碼和標記　370

14.2.4 回歸　373

14.3 實現策略　374

14.3.1 安全的跨瀏覽器修復

方法　375

14.3.2 特性檢測和墊片　375

14.3.3 不可測試的瀏覽器

問題　378

14.4 減少假設　379

14.5 小結　380

14.6 練習　381

附錄A ES6附加特性　383

附錄B 測試與調試的武器　389

附錄C 習題答案　407