✍ Scribed by 李艺 著
No coin nor oath required. For personal study only.
“微信小游戏开发”系列图书包含本书和《微信小游戏开发：后端篇》，融汇了腾讯云TVP李艺多年来的一线项目研发和教学经验。本书最大的特点是基于一个精心设计的PBL实战项目，以模拟项目迭代重构的方式，循序渐进地介绍前端所有的知识点和技能，包括但不限于计算机网络通信基础、JS编程语言、面向对象的软件设计思想和设计模式、模块化编程思想、小游戏开发技巧等。为了方便读者学习，随书还附有相应的完整源码。本书共分为三篇。第一篇（第1章），潜龙勿用，共2课，介绍微信小游戏是如何运行的，以及如何创建第一个小游戏项目。第二篇（第2-5章），见龙在田，共14课。第2-3章介绍如何用HTML5技术实现一个小游戏；第4-5章介绍如何将这个HTML5小游戏改写成微信小游戏，方便开发者从4399平台或3366平台上学习与借鉴开发技巧。第三篇（第6-11章），龙战于野，共16课。本篇是本书的实战重点，主要介绍如何对小游戏项目进行重构，因为好的软件不是事先设计出来的，而是通过不断重构慢慢迭代出来的。第6-8章介绍小游戏项目的模块化重构方法，第9-11章介绍小游戏项目的面向对象重构方法。
封面
书名
序一
序二
前言
目录
第一篇 潜龙勿用
第1章 创建小游戏项目
第1课 创建项目
了解小游戏的双线程运行机制
注册开发者账号
安装微信开发者工具
创建第一个小游戏项目
项目测试：本地预览与手机预览
基于文件监听实现自动预览
了解小游戏示例项目的项目结构
小游戏如何调试代码
拓展：如何安装、配置Node.js和babel-node
了解面向对象编程有关的基本概念
本课小结
第2课 微信小游戏是如何运行的
创建画布
拓展：如何给变量命名
如何绘制矩形
拓展：如何理解小游戏的全局变量及作用域
如何清空画布
如何绘制网络图片
如何在小游戏中实现动画
如何实现人机交互
拓展：如何理解局部变量
拓展：了解微信小游戏的API风格
本课小结
第二篇 见龙在田
第2章 编写一个简单的HTML5小游戏：打造游戏界面
第3课 绘制游戏标题
安装与配置Visual Studio Code
学习使用HTML标记，开始绘制游戏标题
拓展：如何使用const关键字
拓展：如何给代码添加注释
如何改变字体、字号和颜色
拓展：在font-family中要使用中文字体的英文名称
如何给文本添加文本样式
如何在绘制文本中使用渐变色
如何让文本居中绘制
拓展：为什么要在代码中使用常量
本课小结
第4课 绘制挡板
如何在画布上绘制直线
拓展：JS的8 个基本数据类型，如何进行类型判断
给画布添加一个浅色背景
如何加厚挡板
拓展：JS中的数值类型、布尔类型是如何进行类型转换的
如何给挡板添加圆角、阴影效果
使用路径填充和矩形绘制挡板
如何使用颜色渐变对象和图像填充材质绘制挡板
拓展：什么是区块作用域
拓展：了解数字类型，警惕0.1 +0.2不等于0.3
拓展：如何批量声明变量、常量
本课小结
第5课 绘制小球
如何使用弧线绘制圆形
如何使用arc方法直接绘制圆形
本课小结
第6课 绘制分界线
分别通过lineTo和渐变色绘制分界线
拓展：CSS颜色值有哪些格式
使用函数绘制间隔效果
拓展：如何定义和使用函数
使用循环绘制分界线
拓展：使用比较运算符、if控制语句和算术运算符
拓展：JS的5 种循环控制语句
将函数当作变量使用
拓展：如何理解JS的作用域链与闭包
拓展：如何使用集合对象Map与Set
本课小结
第3章 编写一个简单的HTML5小游戏：完成交互功能
第7课 实现动画：让小球动起来
使用定时器实现动画
拓展：如何理解JS的异步执行机制
拓展：了解13 种复合赋值运算符
完成动画的关键：清屏
如何实现小球与屏幕的碰撞检测
拓展：复习使用if else if语句
使用requestAnimationFrame改进动画流畅度
本课小结
第8课 监听用户事件：让挡板动起来
绘制左挡板
使右挡板可以上下自主移动
改用函数绘制挡板
监听用户输入，使用鼠标（或触摸）事件操控左挡板
实现挡板与球的碰撞检测
拓展：如何使用逻辑运算符
统计分数
拓展：复习批量声明变量，可以将逗号放在前面
在游戏结束时添加反馈
拓展：加号与模板字符串
本课小结
第9课 实现游戏的重启功能
绘制重新开始游戏的文本提示
理解HTML5 的事件模型，监听单击事件实现重启功能
拓展：如何使用removeEventListener
本课小结
第10课 控制游戏音效：添加单击音效和背景音乐
如何使用audio标签播放声音
如何使用JS代码播放声音
给项目添加背景音乐
使用图片材质绘制背景音乐按钮
使用离屏画布绘制背景音乐按钮
使用drawImage绘制背景音乐按钮
监听背景音乐按钮的单击事件
拓展：如何使用条件运算符
本课小结
第4章 移植及优化
第11课 移植准备工作
创建代码片段与改写项目
拓展：在小游戏中如何获取屏幕尺寸
拓展：关于代码自动提示
本课小结
第12课 移植音频和事件
处理getElementById is not a function错误
播放音频：处理Audio is not defined错误
处理Audio错误：canPlayType is not a function
处理currentTime错误：currentTime是只读属性
挡板绘制：处理Image is not defined错误
拓展：复习条件运算符和短路评估表达式
准备移植事件监听，认识小游戏的触摸事件
拓展：targetTouches、touches和changedTouches的区别
改写click事件与mousemove事件
拓展：关于小游戏的运行环境
本课小结
第13课 移植文本与图像
处理标题文本不显示的问题
拓展：实现渐变、阴影效果的替代方案
解决左挡板移动到底部不显示的问题
使背景音乐循环播放
优化分数文本、挡板、小球与背景音乐按钮的参数
拓展：如何在测试时静音
本课小结
第5章 移植后对小游戏进行平台功能优化
第14课 绘制微信用户头像
小游戏有哪些授权范围
不能直接查询“用户信息”的授权情况
使用UserInfoButton
拓展：为什么要使用全等运算符而不是等号运算符
绘制用户头像
拓展：学习使用箭头函数及判定this对象
主动销毁按钮
控制头像大小，让左挡板默认展示
主动查询用户授权
拓展：如何在测试中清理缓存
本课小结
第15课 添加游戏反馈
添加Toast提示
在提示窗口中自定义icon
使用模态弹窗
拓展：游戏渲染的帧率可以修改吗
本课小结
第16课 添加超时限制
限制游戏30 s结束
拓展：复习定时器的使用
让游戏支持重启
及时清除定时器
本课小结
第三篇 龙战于野
第6章 模块化重构一：准备重构
第17课 梳理游戏逻辑
在小游戏中如何使用全局变量
拓展：作用域与使用let关键字实现批量变量声明
整理代码，将变量与常量放在文件顶部
梳理游戏逻辑，明确6 个周期函数
添加start函数
添加end函数
添加init函数
添加loop函数
及时移除事件监听
本课小结
第18课 JS如何创建对象及如何实现模块化
使用原型继承对象
使用构造函数创建对象
拓展：理解__proto__与prototype属性
拓展：如何理解原型及原型链
基于原型链实现万能的类型检测方法instanceOf
使用class关键字创建类对象
使用CommonJS规范
使用ES Module规范
拓展：对比CommonJS规范和ES Module规范的差异
本课小结
第7章 模块化重构二：重构背景音乐、小球和挡板
第19课 创建背景音乐模块
开始创建背景音乐模块
拓展：重新认识class和函数调用中的this
拓展：认清JS的内存管理
拓展：了解代码的优化评判标准
改进复用性和易用性：将数据参数化，设置参数的默认值
改进封装性：将内部成员私有化
优化图片渲染：由多次加载改为加载一次
改进封装性：添加getter
对易用性的改进：直接导出单例
本课小结
第20课 创建小球模块
开始创建小球模块
使用跨文件常量
拓展：使用defineProperty将变量改为常量
创建Ball类
本课小结
第21课 创建挡板模块
开始创建Panel类
使用继承实现左、右挡板
拓展：复习JS实现继承的方式
拓展：复习类型检测操作符typeof与instanceof的不同
本课小结
第8章 模块化重构三：重构记分板、背景、页面和游戏对象
第22课 创建记分板模块
实现两个记分板类
拓展：复习ES Module的导出与导入
使用工具方法drawText
隐藏分数变量
本课小结
第23课 创建游戏背景对象和游戏对象
创建背景对象
为创建游戏对象做准备
让音频管理者接管单击音效
实现游戏对象Game类
拓展：复习使用bind改变this对象
本课小结
第24课 创建页面对象
创建游戏结束页面
创建游戏主页对象
本课小结
第25课 重构游戏对象
一个文件只定义一个类
为Game类添加#currentPage变量
解决30 s超时限制不起作用的问题
移除#gameIsOver变量
本课小结
第9章 面向对象重构一：重构游戏对象等
第26课 设计模式重构一：单例模式、观察者模式和组合模式
将Game类改写为单例模式
在Game类上应用观察者模式
使用组合模式改写用户记分板模块
本课小结
第27课 设计模式重构二：模板方法模式、职责链模式和简单工厂模式
在页面对象中启用模板方法模式
使用职责链模式改写单击音效实现
使用简单工厂模式改写turnToPage方法
本课小结
第10章 面向对象重构二：页面对象和分界线的绘制
第28课 设计模式重构三：工厂方法模式和抽象工厂模式
使用工厂方法模式创建Page页面对象
使用抽象工厂模式封装页面对象的创建过程
本课小结
第29课 设计模式重构四：建造者模式、命令模式和原型模式
使用建造者模式构建页面对象
拓展：如何理解建造者模式、抽象工厂模式与模板方法模式
使用命令模式绘制分界线
使用原型模式复制对象
拓展：JS如何实现浅复制与深复制
本课小结
第30课 设计模式重构五：复合命令模式、迭代器模式和享元模式
使用复合命令模式重构GameOverPage
使用迭代器模式改造复合命令实现
使用享元模式改写分界线绘制
本课小结
第11章 面向对象重构三：重构音频管理等
第31课 设计模式重构六：适配器模式、桥接模式和装饰模式
使用适配器模式改造音频管理者
使用桥接模式重构碰撞检测
使用装饰模式重构挡板的渲染方式
本课小结
第32课 设计模式重构七：访问者模式和策略模式
使用访问者模式优化碰撞检测
使用策略模式扩展右挡板的移动算法
拓展：关于25 个设计模式的补充说明
本课小结
附录 思考与练习参考答案
推荐阅读
封底
📜 SIMILAR VOLUMES
本书介绍微信小游戏的后端开发，针对开发者的具体技术需求，主要提供3部分内容：第1章至第3章，讲解广告组件、游戏排行榜等平台功能。第4章至第5章，讲解云开发技术。前5章介绍的都是开发者不需要花钱购买云服务器就可以应用的后端技术。第6章至第7章，讲解分别以Node.js和Go语言编写后端接口及Web管理后台，包括必不可少的MySQL数据库等相关技术讲解。
<p>本书采用“案例诠释理论，项目推动实践”的理念编写。内容包括小程序开发环境、小程序结构分析.界面设计、基本组件、数据存储与访问、多媒体应用开发、硬件设备应用开发、网络应用与云开发等重要内容。全书在章节编排上选取了“易学、易用、易扩展”的技术范例和“有趣、经典、综合性”的项目案例。书中技术范例的实现过程引导读者使用微信小程序开发技术的方法，并以层次性的技术解析讲解技术原理使读者了解实际开发中的各种问题和解决方案: 书中项目案例的设计思路帮助读者开阔视野，并以图文并茂的操作步骤呈现。读者既可以体会“教、学、做”深度融合的乐趣，又可以提高解决实际问题的能力。全书内容新颖，结构清晰，文字流畅，配套
<p>《微信小程序开发快速入门》全面系统地讲解了微信小程序入门知识。开篇讲解了小程序的特点与开发逻辑，以及如何申请和创建一个小程序项目与环境搭建，接着通过多个小程序实例来全面体验和讲解开发框架、实现过程及主要代码框架等，然后介绍小程序组件、开发方式、网络、缓存、位置和界面交互，以及开发过程与组件的应用技巧、各个微信原生API接口小程序开发的技巧等。每章具有多个小程序实战案例，让读者快速掌握该章所讲的知识，并实践小程序各项功能的应用及使用技巧。</p> <p>《微信小程序开发快速入门》结构清晰，由浅入深，可帮助读者快速掌握小程序的开发。适合于各种前端开发者，以及各种APP设计、开发和自学者。<
<p>《微信小程序开发实战：微课视频版 （1600分钟视频 21个完整项目案例）》共包含20章，每章均以项目为驱动，将微信小程序的基础知识点分解实现。全书案例由浅入深，从基础篇的创建第一个微信小程序开始，到应用篇的各类API的实现，包括天气查询、口述校史、电子书橱、医疗急救卡、会议邀请函、指南针和手绘时钟等项目； 本书在游戏篇还包含了拼图、推箱子和贪吃蛇游戏； 在提高篇引入了小程序云开发的概念，例如带有云数据库的高校新闻网、带有云存储的电子书橱； 最后在综合篇给出图片分享社区案例，介绍了第三方Vant Weapp组件库，并结合云开发技术实现了生日管家小程序。</p>
<p>本书是一本从零开始学习的微信小程序开发入门书，无需额外的基础。全书以项目驱动为宗旨，循序渐进、案例丰富，详细介绍了微信小程序的入门基础知识与使用技巧。 全书共分为12章，主要内容包括4个部分。第一部分是入门篇，包括第1章和第2章的内容，这两章介绍了小程序的由来、首次注册和创建项目流程；第二部分是基础篇，包括第3章和第4章的内容，这两章介绍了小程序框架和组件；第三部分是应用篇，包括第5～11章的内容，这7个章节分别讲解了微信小程序中网络API、媒体API、文件API、数据API、位置API、设备API以及界面API的用法；第四部分是提高篇，包括第12章的内容，这一章节提供一个综合应用设计示