JavaScript编程实战

第一部分　坚实的基础

第1章　最佳实践2

1.1 　松耦合2

1.1.1 　紧耦合的问题2

1.1.2 　松耦合的优势3

1...

第一部分　坚实的基础

第1章　最佳实践2

1.1 　松耦合2

1.1.1 　紧耦合的问题2

1.1.2 　松耦合的优势3

1.2 　JavaScript MVC和模板3

1.2.1 　MVC3

1.2.2 　模板5

1.3 　开发工具6

1.3.1 　WebKit开发人员工具6

1.3.2 　Weinre10

1.3.3 　版本控制12

1.3.4 　CSS预处理12

1.4 　测试12

1.4.1 　使用Grunt13

1.4.2 　使用QUnit17

1.5 　小结20

1.6 　补充资源21

第2章　库、框架与插件22

2.1 　选择恰当的JavaScript库22

2.1.1 　jQuery22

2.1.2 　Zepto24

2.1.3 　普通的DOM25

2.2 　使用框架27

2.2.1 　Bootstrap27

2.2.2 　jQuery UI28

2.2.3 　移动框架28

2.3 　其他脚本28

2.3.1 　Modernizr28

2.3.2 　HTML5 Shiv29

2.4 　HTML5样板29

2.5 　寻找jQuery插件30

2.5.1 　去哪里（以及不要去哪里）找30

2.5.2 　要找什么——一个十项检查列表30

2.6 　小结32

2.7 　补充资源32

第二部分　构建前端

第3章　Backbone.js36

3.1 　初识Backbone36

3.1.1 　Backbone是什么36

3.1.2 　为什么要用Backbone36

3.1.3 　Backbone基础37

3.1.4 　什么时候用Backbone37

3.1.5 　设置Backbone38

3.2 　Backbone中的模型38

3.2.1 　创建一个模型39

3.2.2 　创建计算属性39

3.2.3 　设置默认值39

3.2.4 　使用初始化函数40

3.2.5 　使用Backbone事件40

3.2.6 　模型的校验41

3.3 　使用Backbone中的集合42

3.3.1 　创建集合42

3.3.2 　创建集合事件43

3.4 　理解Backbone视图43

3.4.1 　创建视图44

3.4.2 　使用渲染函数44

3.4.3 　使用Backbone中的视图元素46

3.4.4 　使用嵌套视图49

3.5 　数据的保存及获取55

3.5.1 　与服务器上的模型同步55

3.5.2 　在Backbone中使用LocalStorage API58

3.5.3 　把集合保存在服务器上59

3.5.4 　使用Backbone.sync65

3.6 　使用路由控制器66

3.6.1 　路由如何使用66

3.6.2 　设置路由控制器67

3.6.3 　PushState与Hashchange69

3.7 　再谈事件70

3.7.1 　事件解绑定71

3.7.2 　手动触发事件71

3.7.3 　绑定“this”71

3.7.4 　All事件72

3.8 　操作集合73

3.8.1 　取出集合中的条目73

3.8.2 　集合排序74

3.9 　小结76

3.10 　补充资源77

第4章　使用JavaScript模板78

4.1 　认识模板78

4.1.1 　为什么使用模板78

4.1.2 　了解不同的模板库79

4.1.3 　做出正确的选择80

4.2 　使用Underscore模板81

4.2.1 　Underscore模板基础知识81

4.2.2 　重温模板的最佳实践83

4.2.3 　在模板中使用JavaScript85

4.3 　在Backbone中使用模板88

4.3.1 　不用模板设置模型和视图88

4.3.2 　用模板渲染视图89

4.4 　小结92

4.5 　补充资源92

第5章　创建表单93

5.1 　理解渐进式增强93

5.1.1 　渐进式增强方式93

5.1.2 　为什么要渐进式增强94

5.1.3 　决定支持哪个环境94

5.2 　让HTML5替你工作95

5.2.1 　HTML5的输入控件类型95

5.2.2 　交互特性102

5.3 　给老浏览器用Polyfill104

5.3.1 　寻找第三方Polyfill105

5.3.2 　编写自己的Polyfill105

5.4 　连接REST API112

5.4.1 　提交表单113

5.4.2 　构建通用函数114

5.5 　Backbone中的表单115

5.5.1 　设置表单模型115

5.5.2 　设置表单视图116

5.5.3 　将表单域保存到模型中117

5.5.4 　添加校验118

5.5.5 　清理模板123

5.5.6 　必填项124

5.5.7 　提交表单126

5.5.8 　合并代码128

5.6 　小结132

5.7 　补充资源132

第三部分　编写服务器端JavaScript

第6章　Node.js简介136

6.1 　为什么是Node136

6.1.1 　在实时程序中使用Node136

6.1.2 　Node的工作机制137

6.2 　安装Node138

6.2.1 　在Mac/Linux上安装138

6.2.2 　在Windows上安装139

6.2.3 　检查安装情况140

6.3 　Node入门140

6.3.1 　创建服务器140

6.3.2 　添加内容141

6.3.3 　打包141

6.3.4 　运行脚本142

6.3.5 　简化脚本143

6.3.6 　使用Node REPL143

6.4 　Node模块145

6.4.1 　引入模块145

6.4.2 　外部模块和NPM146

6.4.3 　寻找模块147

6.5 　Node 模式148

6.5.1 　模块和全局变量148

6.5.2 　异步模式152

6.5.3 　事件154

6.5.4 　子进程155

6.6 　小结158

6.7 　补充资源158

第7章　Express框架160

7.1 　Express入门160

7.1.1 　安装Express160

7.1.2 　创建Express程序160

7.2 　设置路由161

7.2.1 　已有路由162

7.2.2 　创建新的路由163

7.2.3 　POST、PUT和DELETE163

7.3 　渲染视图164

7.3.1 　启用Underscore模板164

7.3.2 　创建视图166

7.4 　处理表单数据172

7.4.1 　创建POST路由172

7.4.2 　将反馈发给模板173

7.5 　发封邮件178

7.5.1 　连到SMTP服务器上178

7.5.2 　构建Email消息179

7.5.3 　发送邮件179

7.5.4 　在结束之前180

7.6 　小结182

7.7 　补充资源182

第8章　MongoDB184

8.1 　NoSQL数据库有什么好处184

8.1.1 　扩展能力184

8.1.2 　简单性184

8.2 　MongoDB入门185

8.2.1 　安装MongoDB185

8.2.2 　运行MongoDB186

8.2.3 　安装MongoDB模块187

8.2.4 　创建数据库187

8.3 　MongoDB中的CRUD188

8.3.1 　创建集合188

8.3.2 　读取数据190

8.3.3 　更新数据194

8.3.4 　删除数据196

8.4 　Mongoose197

8.4.1 　Mongoose入门197

8.4.2 　创建模型198

8.4.3 　读取数据200

8.5 　数据库上的其他选择204

8.6 　小结204

8.7 　补充资源204

第四部分　挑战极限

第9章　用WebSockets构建实时程序208

9.1 　WebSockets的工作机制208

9.1.1 　轮询的问题208

9.1.2 　WebSockets方案209

9.2 　Socket.IO入门210

9.2.1 　服务器上的Socket.IO210

9.2.2 　客户端的Socket.IO211

9.3 　构建实时的聊天室212

9.3.1 　创建聊天室视图212

9.3.2 　将消息提交给服务器214

9.3.3 　在服务器端处理消息215

9.3.4 　在客户端显示新消息216

9.3.5 　添加Backbone.js结构217

9.3.6 　添加用户223

9.3.7 　添加时间戳225

9.3.8 　保存到MongoDB中227

9.3.9 　合并代码229

9.4 　小结233

9.5 　补充资源234

第10章　进入移动领域235

10.1 　搭建移动App235

10.1.1 　检测移动终端235

10.1.2 　设置移动端网站的样式237

10.1.3 　移动端框架238

10.2 　集成触屏238

10.2.1 　基本触摸事件239

10.2.2 　复杂的触摸手势239

10.3 　Geolocation248

10.3.1 　找到用户的位置248

10.3.2 　连接Google地图249

10.3.3 　追踪Geolocation的变化251

10.4 　电话号码和短信251

10.4.1 　静态的电话号码和SMS链接251

10.4.2 　用JavaScript拨打电话和发送短信252

10.5 　PhoneGap252

10.5.1 　PhoneGap的优与劣253

10.5.2 　PhoneGap入门254

10.5.3 　连接相机254

10.5.4 　连接通讯录254

10.5.5 　其他API255

10.6 　小结255

10.7 　补充资源255

第11章　JavaScript图形257

11.1 　画布基础257

11.1.1 　画出基本的形状258

11.1.2 　让画布动起来260

11.1.3 　画布中的鼠标事件261

11.2 　SVG基础261

11.2.1 　让SVG动起来262

11.2.2 　SVG鼠标事件262

11.2.3 　编码SVG263

11.3 　Rapha?l.js263

11.3.1 　作画路径264

11.3.2 　画曲线265

11.3.3 　样式266

11.3.4 　动画268

11.3.5 　鼠标事件269

11.4 　用gRapha?l做图表270

11.4.1 　饼图270

11.4.2 　柱状图271

11.4.3 　折线图273

11.5 　带WebGL的3D画布276

11.5.1 　Three.js简介276

11.5.2 　创建图像纹理280

11.5.3 　3D动画281

11.5.4 　添加鼠标事件282

11.5.5 　使用备选的2D画布283

11.6 　CSS中的3D变换284

11.7 　小结286

11.8 　补充资源286

第12章　推出你的程序288

12.1 　性能检查表288

12.1.1 　重点在哪288

12.1.2 　资源管理290

12.1.3 　动画优化291

12.1.4 　少做为妙295

12.1.5 　规避回流295

12.2 　部署296

12.2.1 　把静态资源部署在CDN上296

12.2.2 　把Node服务部署在EC2上297

12.3 　推出297

12.4 　补充资源297

附录A 　用LESS做CSS预处理299

A.1 　LESS简介299

A.1.1 　预处理的好处299

A.1.2 　安装LESS编译器300

A.1.3 　在服务器上编译300

A.2 　LESS的基础知识300

A.2.1 　变量300

A.2.2 　操作符301

A.2.3 　嵌套302

A.3 　函数和Mixin304

A.3.1 　函数304

A.3.2 　Mixin305

A.4 　文件结构306

A.4.1 　使用Import306

A.4.2 　文件结构示例306

A.4.3 　定制结构307

A.5 　小结307

A.6 　补充资源307

继松耦合之后，JavaScript模型视图控制器（MVC）和模板是本书要强调的另一个设计模式。它们提供了一个可以把程序各方面解耦的结构。 1.2.1　MVC MVC是一种鼓励松耦合的设计模式。它把驱动程序的数据从显示数据的视觉界面上分离出来。采用MVC框架后，可以在不修改底层数据的情况下改变前端界面的风格。因为MVC将关注点分解到了三个相互关联的组件中：模型、视图和控制器，如图1-1所示。 ...

(查看全部试读)