JavaScript設計模式

目　錄

第1章　介紹　1

第2章　什么是模式　3
　　我們每天都在使用模式　4

第3章　模式狀態(tài)測試、Proto模式及三法則　6

第4章　設計模式的結構　8

第5章　編寫設計模式　11

第6章　反模式　13

第7章　設計模式類別　15

第8章　設計模式分類　17
　　有關類(Class)的要點　17

第9章 JavaScript設計模式　20
9.1 Constructor(構造器)模式　21
9.1.1 對象創(chuàng)建　21
9.1.2 基本Constructor(構造器)　23
9.1.3 帶原型的Constructor(構造器)　24
9.2 Module(模塊)模式　25
9.2.1 對象字面量　25
9.2.2 Module(模塊)模式　27
9.2.3 Module模式變化　31
9.3 Revealing Module(揭示模塊)模式　36
9.3.1 優(yōu)點　38
9.3.2 缺點　38
9.4 Singleton(單例)模式　38
9.5 Observer(觀察者)模式　42
9.5.1 Observer(觀察者)模式和Publish/Subscribe(發(fā)布/訂閱)模式的區(qū)別　47
9.5.2 優(yōu)點　49
9.5.3 缺點　49
9.5.4 Publish/Subscribe實現(xiàn)　49
9.6 Mediator(中介者)模式　59
9.6.1 基本實現(xiàn)　60
9.6.2 高級實現(xiàn)　61
9.6.3 示例　67
9.6.4 優(yōu)點和缺點　68
9.6.5 中介者(Mediator)與觀察者(Observer)　69
9.6.6 中介者(Mediator)與外觀(Facade)　69
9.7 Prototype(原型)模式　70
9.8 Command(命令)模式　73
9.9 Facade(外觀)模式　75
　　有關抽象的要點　78
9.10 Factory(工廠)模式　78
9.10.1 何時使用Factory模式　81
9.10.2 何時不應使用Factory模式　81
9.10.3 Abstract Factory(抽象工廠)　81
9.11 Mixin模式　82
9.11.1 子類化　83
9.11.2 Mixin(混入)　84
9.12 Decorator(裝飾者)模式　88
9.12.1 偽經(jīng)典Decorator(裝飾者)　91
9.12.2 使用jQuery的裝飾者　96
9.12.3 優(yōu)點和缺點　97
9.13 Flyweight(享元)模式　98
9.13.1 使用Flyweight模式　98
9.13.2 Flyweight和共享數(shù)據(jù)　99
9.13.3 實現(xiàn)經(jīng)典Flyweight(享元)　99
9.13.4 轉換代碼以使用Flyweight(享元)模式　103
9.13.5 基本工廠　105
9.13.6 管理外部狀態(tài)　106
9.13.7 Flyweight(享元)模式和DOM　107

第10章　JavaScript MV*模式　112
10.1 MVC　112
　　Smalltalk-80 MVC　113
10.2 為JavaScript開發(fā)人員提供的MVC　114
10.2.1 Model(模型)　114
10.2.2 View(視圖)　116
10.2.3 Controller(控制器)　119
10.2.4 Spine.js與Backbone.js　120
10.3 MVC為我們提供了什么　122
10.4 JavaScript中的Smalltalk-80 MVC　122
10.4.1 深入挖掘　123
10.4.2 總結　123
10.5 MVP　124
10.5.1 Model、View和Presenter　124
10.5.2 MVP或MVC？　125
10.5.3 MVC、MVP和Backbone.js　126
10.6 MVVM　128
10.6.1 歷史　129
10.6.2 Model　129
10.6.3 View　130
10.6.4 ViewModel　133
10.6.5 小結：View和ViewModel　135
10.6.6 小結：ViewModel和Model　135
10.7 利與弊　135
10.7.1 優(yōu)點　135
10.7.2 缺點　136
10.8 使用更松散數(shù)據(jù)綁定的MVVM　136
10.9 MVC、MVP與MVVM　141
10.10 Backbone.js與KnockoutJS　142

第11章 模塊化的JavaScript設計模式　144
11.1 腳本加載器要點　145
11.2 AMD　145
11.2.1 模塊入門　146
11.2.2 使用Dojo的AMD模塊　150
11.2.3 AMD模塊設計模式(Dojo)　151
11.2.4 使用jQuery的AMD模塊　152
11.2.5 AMD總結　155
11.3 CommonJS　155
11.3.1 入門指南　156
11.3.2 使用多個依賴　157
11.3.3 支持CommonJS的加載器和框架　158
11.3.4 CommonJS適用于瀏覽器嗎？　158
11.3.5 延伸閱讀　159
11.4 AMD和CommonJS：互相競爭，標準同效　159
　　UMD：用于插件的AMD和CommonJS兼容模塊　160
11.5 ES Harmony　165
11.5.1 具有Imports和Exports的模塊　166
11.5.2 從遠程數(shù)據(jù)源加載的模塊　167
11.5.3 模塊加載器API　167
11.5.4 用于服務器的類CommonJS模塊　168
11.5.5 具有構造函數(shù)、getter和setter的類　168
11.5.6 ES Harmony總結　169
11.5.7 延伸閱讀　170
11.6 總結　170

第12章 jQuery中的設計模式　171
12.1 Composite(組合)模式　171
12.2 Adapter(適配器)模式　173
12.3 Facade(外觀)模式　174
12.4 Observer(觀察者)模式　177
12.5 Iterator(迭代器)模式　180
12.6 延遲初始化　181
12.7 Proxy(代理)模式　183
12.8 Builder(生成器)模式　184

第13章 jQuery插件設計模式　187
13.1 模式　188
13.2 Lightweight Start模式　189
　　延伸閱讀　191
13.3 完整的Widget Factory模式　191
　　延伸閱讀　194
13.4 嵌套命名空間插件模式　194
　　延伸閱讀　196
13.5 自定義事件插件模式(使用Widget Factory)　196
　　延伸閱讀　198
13.6 使用DOM-to-Object Bridge模式的原型繼承　198
　　延伸閱讀　200
13.7 jQuery UI Widget Factory Bridge模式　200
　　延伸閱讀　203
13.8 使用Widget Factory的jQuery Mobile Widget　203
13.9 RequireJS和jQuery UI Widget Factory　206
13.9.1 用法　208
13.9.2 延伸閱讀　209
13.10 全局選項和單次調用可重寫選項(最佳選項模式)　209
　　延伸閱讀　211
13.11 高可配和高可變的插件模式　211
　　延伸閱讀　213
13.12 是什么使插件超越模式　213
13.12.1 質量　214
13.12.2 代碼風格　214
13.12.3 兼容性　214
13.12.4 可靠性　214
13.12.5 性能　214
13.12.6 文檔　215
13.12.7 維護的可能性　215
13.13 總結　215
13.14 命名空間模式　215
13.15 命名空間基礎　216
13.15.1 單一全局變量　216
13.15.2 命名空間前綴　217
13.15.3 對象字面量表示法　217
13.15.4 嵌套命名空間　221
13.15.5 立即調用的函數(shù)表達式(IIFE)　222
13.15.6 命名空間注入　224
13.16 高級命名空間模式　226
13.16.1 自動嵌套的命名空間　227
13.16.2 依賴聲明模式　229
13.16.3 深度對象擴展　229
13.16.4 推薦　232

第14章　總結　233

附錄　參考文獻　235