趣学框架设计与应用(DOM游戏卷)

Facebook、腾讯、百度、谷歌工程师联合推荐
1.生动有趣的游戏实例，还原了框架设计的原理和应用。
2.通过常见游戏的实现，深入浅出地介绍了框架的技术细节，以及设计模式的应用，由易到难，循序渐进。
3.深入讲解目前流行的前端框架的实现原理与不错应用，帮助读者了解前端新的开发技术。

本书是一本讲解框架和模式的技术书，也是一本把框架应用于游戏开发的实战书，本书通过虚拟主人公小铭和小白两个人的对话，展示了框架的核心技术，并通过几个典型的游戏，讲述了框架技术的实现、游戏中的算法和框架技术的应用场景。
本书适合程序开发人员、前端开发人员和项目经理阅读，也可以作为高等院校和培训学校的教材。

张荣铭，原百度不错前端工程师，曾百度首页，百度图片等项目，著书《Javascript设计模式》，爱创课堂创始人。

目  录

第  1章 《贪吃蛇》游戏与面向对象编程  1
游戏综述  1
游戏玩法  1
项目部署  2
入口文件  2
1.1  接到任务  2
1.2  3个模块  3
1.3  地图绘制  3
1.4  舞台主角  6
1.5  移动起来  7
1.6  不要“头铁”  10
1.7  画个圆圈  11
1.8  奖励食物  13
1.9  获取奖励  16
1.10  增加难度  18
1.11  一盆冷水  20
下一章剧透  21
我问你答  21
附件  22
第  2章 《大转盘》游戏——模块化与
  组件化开发  23
游戏综述  23
游戏玩法  23
项目部署  24
入口文件  24
2.1  新的开始  24
2.2  命名空间  25
2.3  模块通信  26
2.4  组件化开发  31
2.5  模块基类  33
2.6  生命周期  34
2.7  定义模块  37
2.8  方法重载  40
2.9  项目启动  41
2.10  卸载模块  42
2.11  消息规范  43
2.12  绘制视图  44
2.13  加入玩家  46
2.14  大功告成  48
下一章剧透  49
我问你答  49
附件  49
第3章  《谁是卧底》与Socket服务  52
游戏综述  52
游戏玩法  52
项目部署  53
入口文件  54
3.1  公司活动  54
3.2  “国王”的诞生  54
3.3  与服务器交互  58
3.4  搭建城堡  59
3.5  “国王”有点忙  61
3.6  创建“子民”  66
3.7  扩展消息  68
3.8  添加样式  71
3.9  “国王”的“传令官”  75
下一章剧透  78
我问你答  79
附件  79
第4章  《五子棋》与参数注入服务  82
游戏综述  82
游戏玩法  82
项目部署  83
入口文件  84
4.1  五子棋大赛  84
4.2  创建项目  85
4.3  游戏模块  85
4.4  游戏操作方法  86
4.5  实现游戏消息  88
4.6  方法重载  91
4.7  参数注入  93
4.8  全局配置  95
4.9  全局消息  95
4.10  模块依赖  96
4.11  解析依赖  98
4.12  绘制棋盘  101
4.13  创建棋盘  107
4.14  添加棋手  108
4.15  发布消息  108
4.16  接收消息  110
4.17  事件模块  112
4.18  绑定交互  113
4.19  棋手下棋  114
4.20  胜负检测  114
4.21  检测算法  116
下一章剧透  121
我问你答  121
附件  121
第5章  《2048》与虚拟DOM  125
游戏综述  125
游戏玩法  125
项目部署  126
入口文件  126
5.1  火爆游戏——《2048》  127
5.2  青出于蓝而胜于蓝  128
5.3  虚拟DOM  128
5.4  绘制视图  130
5.5  地图模块  132
5.6  事件交互  135
5.7  核心算法  136
5.8  愉快体验  140
下一章剧透  140
我问你答  140
附件  141
第6章  《拼图》游戏与触屏事件  144
游戏综述  144
游戏玩法  144
项目部署  145
入口文件  145
6.1  说做就做  146
6.2  事件模块  147
6.3  注册全局消息  147
6.4  订阅事件  148
6.5  解析事件  149
6.6  事件对象  151
6.7  取消事件  152
6.8  滑动事件  152
6.9  轻拍事件  153
6.10  键盘事件  154
6.11  事件测试  155
6.12  渲染视图  157
6.13  修改方格  159
6.14  DOM服务  160
6.15  添加交互  161
6.16  游戏进度  163
6.17  绘制时间进度  164
6.18  游戏结束  166
下一章剧透  168
我问你答  168
附件  169
第7章  《赛车》游戏与游戏模块  172
游戏综述  172
游戏玩法  172
项目部署  173
入口文件  173
7.1  帧与游戏  174
7.2  游戏模块  175
7.3  游戏周期  176
7.4  游戏方法  178
7.5  测试游戏  180
7.6  初始化游戏界面  181
7.7  视图消息  184
7.8  让汽车动起来  185
7.9  切换赛道  187
7.10  轧过减速带  189
7.11  初始化障碍汽车  189
7.12  更新障碍汽车  191
7.13  订阅消息  192
下一章剧透  194
我问你答  194
附件  194
第8章  《连连看》、组件开发以及MVVM模式
  中的数据双向绑定和自定义指令  197
游戏综述  197
游戏玩法  197
项目部署  198
入口文件  198
8.1  MVVM模式  199
8.2  组件生命周期  199
8.3  绑定数据  201
8.4  监听器消息  203
8.5  确定模板  205
8.6  模板编译  206
8.7  指令编译  207
8.8  事件指令  209
8.9  属性指令  209
8.10  功能指令  210
8.11  插值指令  211
8.12  脏值检测  212
8.13  组件销毁  213
8.14  绑定内容  213
8.15  绑定样式  215
8.16  数据双向绑定  215
8.17  显/隐指令  216
8.18  创建/删除指令  217
8.19  循环指令  217
8.20  《阿达连连看》  219
8.21  地图模块  220
8.22  视图模块  221
8.23  游戏交互  224
8.24  连接图片  226
8.25  连接算法  228
8.26  游戏进度  232
下一卷剧透  234
我问你答  234
资源整理  234
附件  235

我和张容铭是好朋友。我知道他做过很多复杂的前端项目。当我很初学习JavaScript语言时，经常向他咨询前端技术。从和他的技术讨论中，我获益良多。我很赞成容铭通过案例提出概念的方法。的确，对于初学者来说，这是一个学习概念很有效的方法。特别是，本书中的所有案例都是游戏，这样使阅读更加轻松。想对框架开发的核心概念有深刻理解的人都可以从本书中受益。
—H.T. Wu，Facebook软件开发工程师

我在中国工作时认识了张容铭。在此期间，我们有很多关于前端技术的讨论，我发现他对设计模式和JavaScript有深刻的理解。本书是他关于技术和经验的总结。本书基于老师和学生之间的讨论，有助于初学者理解JavaScirpt语言和前端技术。这也是JavaScript开发人员可以参考的出色的教材。
—Tony Zhang，Google软件开发工程师

张容铭曾在百度担任不错工程师，是爱创课堂创始人，多年来一直从事计算机前端领域的研究。我在上大学时就认识了他，在大学网页设计竞赛期间，我对他的勤奋和才华印象深刻。他不仅在竞赛中取得优异成绩，还具有很好的团队领导能力和出色的语言表达能力。在他出版新书之际，我强烈推荐本书给想要投入前端领域的读者。读者将通过学习每个游戏开发的步骤，进而掌握框架设计的应用。
—J.T. Wu博士，加州大学欧文分校

看到本书的时候我很惊喜，本书更大的作用在于展示一个有趣的场景，让你自己去思考如何通过具体场景设计框架，而不是盲目地学习技术。如果你学会了对于一个程序员很重要的东西—框架，就能做出引人入胜的产品。
—王群，百度视觉团队前端工程师，多模搜索部前端技术负责人

对于想入门前端游戏开发的程序员来说，这是一本很实用的图书。本书通过常见游戏的实现，深入浅出地介绍了框架的技术细节，以及设计模式的应用，处处体现了作者对编码质量的追求。
—杨坤，百度前端工程师

在HTML 5流行之后，游戏开发一直是前端领域的热门话题，很多开发者都以游戏开发作为自己的立身之本。很多人刚刚接触到游戏开发，在准备大展拳脚的时候，往往在技术选型这关就栽了跟头。本书通过生动的游戏既介绍了常见的游戏开发技术，又剖析了前端框架。除了常见的游戏开发技术DOM和Canvas外，本书也对工程化等技术进行了深入剖析。这是进入游戏开发领域的一本好书。
—王鹏飞，阿里巴巴蚂蚁金服团队前端工程师

本书汇聚了作者多年来的技术和经验，并用一种幽默风趣的方式来写作。在当今Web技术日益发展的时代，本书用一种新颖的写作方式来讲解前端框架技术，通过每一个小游戏来引出前端的技术，深入浅出，通俗易懂，很好适合前端开发者学习。
—方杰，腾讯微信团队不错工程师

作者一直走在前端技术的前沿，并深入研究和不断创新。其前几本著作的内容清晰明了，引人入胜，广受欢迎，都成为畅销书。本书以多个游戏项目为示例，深入讲解目前流行的前端框架的实现原理与不错应用，可以帮助读者了解前端新的开发技术，强烈推荐本书。
—冯振兴，用友集团不错前端工程师