第1部分 基础知识

1 单页面应用程序介绍

 1.1 SPA简述

1.1.1 无须刷新浏览器

1.1.2 表现逻辑位于客户端

1.1.3 服务器端事务处理

 1.2 更进一步

1.2.1 以Shell页面开始

1.2.2 从传统页面到视图

1.2.3 视图的产生

1.2.4 实现无刷新的视图切换

1.2.5 贯穿动态更新过程的流畅性

 1.3 SPA应用相较传统Web应用的优势

 1.4 温故知新

 1.5 优秀SPA应用的构成

1.5.1 组织项目

1.5.2 创建可维护的松耦合

1.5.3 使用JavaScript模块

1.5.4 执行SPA导航

1.5.5 创建视图组成与布局

1.5.6 模块通信

1.5.7 与服务器端通信

1.5.8 执行单元测试

1.5.9 客户端自动化技术

 1.6 小结

2 MV*框架介绍

 2.1 MV*概念

2.1.1 传统UI设计模式

2.1.2 MV*和浏览器环境

 2.2 MV*基础概念

2.2.1 框架

2.2.2 我们的MV*项目

2.2.3 模型

2.2.4 绑定

2.2.5 模板

2.2.6 视图

 2.3 为什么要用MV*框架

2.3.1 关注分离

2.3.2 简化日常任务

2.3.3 提升生产率

2.3.4 标准化

2.3.5 可扩展性

 2.4 框架选择

 2.5 挑战环节

 2.6 小结

3 JavaScript模块化

 3.1 模块概念

3.1.1 模块模式概念

3.1.2 模块结构

3.1.3 揭示模式

 3.2 模块化编程的意义

3.2.1 避免命名冲突

3.2.2 保护代码完整性

3.2.3 隐藏复杂性

3.2.4 降低代码改变带来的冲击

3.2.5 代码组织

3.2.6 模块模式的不足

 3.3 模块模式剖析

3.3.1 可访问性控制

3.3.2 创建公有API

3.3.3 允许全局导入

3.3.4 创建模块的命名空间

 3.4 模块加载及依赖管理

3.4.1 脚本加载器

3.4.2 异步模块定义——AMD

3.4.3 通过RequireJS实践AMD

 3.5 挑战环节

 3.6 小结

第2部分 核心概念

4 单页面导航

 4.1 客户端路由器概念

4.1.1 传统导航

4.1.2 SPA 导航

 4.2 路由及其配置

4.2.1 路由语法

4.2.2 路由配置项

4.2.3 路由参数

4.2.4 缺省路由

 4.3 客户端路由器的工作机制

4.3.1 片段标识符方式

4.3.2 HTML5历史API方式

4.3.3 使用HTML5历史API方式

 4.4 综合实作：实现SPA路由

4.4.1 教员列表（缺省路由）

4.4.2 主要联系人路由

4.4.3 教员授课时间（参数化路由）

 4.5 挑战环节

 4.6 小结

5 视图合成与布局

 5.1 项目介绍

 5.2 布局设计概念

5.2.1 视图

5.2.2 Region

5.2.3 视图合成

5.2.4 嵌套视图

5.2.5 路由

 5.3 高级合成与布局的可选方案

5.3.1 优点

5.3.2 缺点

 5.4 设计应用程序

5.4.1 设计基本布局

5.4.2 设计基本内容

5.4.3 在复杂设计中应用视图管理

5.4.4 通过自身状态创建嵌套视图

 5.5 挑战环节

 5.6 小结

6 模块间交互

 6.1 模块概念回顾

6.1.1 用模块封装代码

6.1.2 API提供对内部功能的访问控制

6.1.3 SRP——以单一目的作为设计出发点

6.1.4 代码重用——控制项目规模

 6.2 模块间交互方式

6.2.1 通过依赖进行模块间交互

6.2.2 依赖方式的优缺点

6.2.3 通过发布/订阅模式进行模块间交互

6.2.4 发布/订阅模式优缺点

 6.3 示例项目细节

6.3.1 搜索功能

6.3.2 显示产品信息

 6.4 挑战环节

 6.5 小结

7 与服务器端通信

 7.1 示例项目新要求

 7.2 与服务器端通信综述

7.2.1 选择数据类型

7.2.2 HTTP请求方法

7.2.3 数据转换

 7.3 使用MV*框架

7.3.1 请求生成

7.3.2 通过回调函数处理结果

7.3.3 通过Promise处理结果

7.3.4 Promise错误处理

 7.4 RESTful Web服务调用

7.4.1 什么是REST

7.4.2 REST原则

7.4.3 MV*框架的RESTful支持

 7.5 示例项目细节

7.5.1 配置REST调用

7.5.2 添加产品到购物车

7.5.3 查看购物车

7.5.4 修改购物车

7.5.5 从购物车中移除产品

 7.6 挑战环节

 7.7 小结

8 单元测试

 8.1 示例项目说明

 8.2 什么是单元测试

8.2.1 单元测试的好处

8.2.2 构建更好的单元测试

 8.3 传统的单元测试

8.3.1 QUnit起步

8.3.2 创建第一个单元测试

8.3.3 测试由MV*对象创建的代码

8.3.4 测试对DOM所做的改变

8.3.5 混合使用其他测试框架

 8.4 挑战环节

 8.5 小结

9 客户端任务自动化

 9.1 Task Runner的常见用途

9.1.1 即时刷新浏览器

9.1.2 自动化JavaScript和CSS的预处理过程

9.1.3 自动化Linter代码分析

9.1.4 持续单元测试

9.1.5 文件串接

9.1.6 代码压缩

9.1.7 持续集成

 9.2 Task Runner选择

 9.3 本章示例项目

9.3.1 Gulp.js介绍

9.3.2 创建第一个任务

9.3.3 创建代码分析任务

9.3.4 创建浏览器刷新任务

9.3.5 自动化单元测试

9.3.6 创建构建过程

 9.4 挑战环节

 9.5 小结

A 员工通讯录示例说明

B XMLHttpRequest API

C 第7 章内容的服务器端设置与总结

D 安装Node.js 与Gulp.js

SPA开发技术的运用是当今Web开发领域的热门趋势，但真正全面掌握该技术的开发者并不多。埃米顿·A.斯科特著的这本《SPA设计与架构（理解单页面Web应用）》详尽阐述单页面Web应用(SPA)开发技术，从SPA构建基础入手，通过MV*、模块化编程、路由、模块间通信、服务器端交互等概念的阐述，全面介绍SPA的设计与架构，帮助读者正确掌握SPA开发的各方面知识要素。同时，书中还讨论了SPA的单元测试及客户端任务自动化，覆盖了从开发到部署的一系列任务，让读者在阅读完本书之后能够打下扎实的SPA开发基础。

本书的重点是帮助读者正确、全面地掌握SPA开发概念，这些概念都是通用的。但为了让内容更全面、具体，本书将通过Knockout、Backbone.js及AngularJS这三种不同风格的MV*框架来进行比较性讨论，这是本书的一大特色。同时在涉及具体Mv*框架知识点时，书中会提供相应介绍。书中示例丰富具体，并提供完整源代码下载。

本书适合前端及对SPA技术感兴趣的开发者阅读。读者只需掌握JavaScript、HTML和CSS基本知识，就可以阅读本书。

Web应用发展的下一个热点是单页面Web应用程序，其将原生桌面应用的流畅体验带到了浏览器。如果你打算从传统Web应用跨越到SPA却又无从下手，那么这本书正是为你准备的。

埃米顿·A.斯科特著的这本《SPA设计与架构（理解单页面Web应用）》讲述SPA应用程序构建所需的设计与开发技术。书中首先介绍SPA模型，并阐述SPA标准构建方式。随着内容的展开，作者通过具体的SPA构建知识点引导你前进，涵盖MV*框架、单元测试、路由、布局管理、数据访问、发布／订阅模式以及客户端任务自动化等内容。书中示例丰富易懂，并可结合各种第三方库或框架来创建。