《TYPESCRIPT图形渲染实战:2D架构设计与实现》步磊峰 | PDF下载|ePub下载

目录
前言
第1篇 TypeScript篇
第1章 构建TypeScript开发、编译和调试环境2
1.1 TypeScript简介2
1.2 安装TypeScript开发环境3
1.2.1 安装Node.js3
1.2.2 安装VS Code4
1.2.3 NPM全局安装TypeScript6
1.2.4 **个TypeScript程序7
1.3 使用TypeScript编译（转译）器13
1.3.1 生成tsconfig.json文件13
1.3.2 解决生成tsconfig.json文件后带来的常见问题13
1.3.3 自动编译TypeScript文件15
1.4 模块化开发TypeScript15
1.4.1 tsconfig.json文件中的target和module命令选项16
1.4.2 编写Canvas2D类导出给main.ts调用16
1.4.3 使用lite-server搭建本地服务器17
1.5 使用SystemJS自动编译加载TypeScript18
1.5.1 NPM本地安装TypeScript库和SystemJS库18
1.5.2 SystemJS直接编译TypeScript源码19
1.6 使用VS Code调试TypeScript源码20
1.6.1 安装及配置Debugger for Chrome扩展20
1.6.2 VS Code中单步调试TypeScript20
1.7 本章总结22
第2章 使用TypeScript实现 Doom 3词法解析器24
2.1 Token与Tokenizer24
2.1.1 Doom3文本文件格式26
2.1.2 使用IDoom3Token与IDoom3Tokenizer接口26
2.1.3 ES 6中的模板字符串28
2.1.4 IDoom3Token与IDoom3Tokenizer接口的定义29
2.2 IDoom3Token与IDoom3Tokenizer接口的实现30
2.2.1 Doom3Token类成员变量的声明30
2.2.2 Doom3Token类变量初始化的问题31
2.2.3 IDoom3Token接口方法的实现32
2.2.4 Doom3Token类的非接口方法实现33
2.2.5 Doom3Tokenzier处理数字和空白符34
2.2.6 IDoom3Tokenizer接口方法实现34
2.2.7 Doom3Tokenizer字符处理私有方法35
2.2.8 核心的getNextToken方法36
2.2.9 跳过不需处理的空白符和注释37
2.2.10 实现_getNumber方法解析数字类型38
2.2.11 实现_getSubstring方法解析子字符串40
2.2.12 实现_getString方法解析字符串41
2.2.13 IDoom3Tokenizer词法解析器状态总结42
2.3 使用工厂模式和迭代器模式43
2.3.1 微软COM中创建接口的方式43
2.3.2 Doom3Factory工厂类43
2.3.3 迭代器模式44
2.3.4 模拟微软.NetFramework中的泛型迭代器44
2.3.5 IDoom3Tokenizer扩展 IEnumerator接口45
2.3.6 修改Doom3Tokenizer源码45
2.3.7 使用VS Code中的重命名重构方法46
2.3.8 使用迭代器解析Token46
2.3.9 面向接口与面向对象编程的个人感悟47
2.4 从服务器获取资源47
2.4.1 HTML加载本地资源遇到的问题48
2.4.2 从服务器加载资源48
2.4.3 使用XHR向服务器请求资源文件49
2.4.4 TypeScript中的类型别名50
2.4.5 使用doGet请求文本文件并解析51
2.4.6 解决仍有空白字符输出问题52
2.4.7 实现doGetAsync异步请求方法52
2.4.8 声明TypeScript中的回调函数54
2.4.9 调用回调函数55
2.5 本章总结57
第2篇 Canvas2D篇
第3章 动画与Application类60
3.1 requestAnimationFrame方法与动画60
3.1.1 HTML中不间断的循环60
3.1.2 requestAnimationFrame与监视器刷新频率62
3.1.3 基于时间的更新与重绘65
3.2 Application类及其子类67
3.2.1 Application类体系结构67
3.2.2 启动动画循环和停止动画循环68
3.2.3 Application类中的更新和重绘69
3.2.4 回调函数的this指向问题70
3.2.5 函数调用时this指向的Demo演示71
3.2.6 CanvasInputEvent及其子类73
3.2.7 使用getBoundingRect方法变换坐标系75
3.2.8 将DOM Event事件转换为CanvasInputEvent事件77
3.2.9 EventListenerObject与事件分发77
3.2.10 让事件起作用79
3.2.11 Canvas2DApplication子类和WebGLApplication子类79
3.3 测试及修正Application类80
3.3.1 继承并覆写Application基类的虚方法80
3.3.2 测试ApplicationTest类81
3.3.3 多态（虚函数动态绑定）82
3.3.4 鼠标单击事件测试83
3.3.5 CSS盒模型对_viewportToCanvasCoordinate的影响84
3.3.6 正确的_viewportToCanvasCoordinate方法实现86
3.4 为Application类增加计时器功能90
3.4.1 Timer类与TimeCallback回调函数90
3.4.2 添加和删除Timer（计时器）91
3.4.3 触发多个定时任务的操作93
3.4.4 测试Timer功能95
3.5 本章总结96
第4章 使用Canvas2D绘图98
4.1 绘制基本几何体98
4.1.1 Canvas2DApplication的绘制流程98
4.1.2 绘制矩形Demo99
4.1.3 模拟Canvas2D中渲染状态堆栈100
4.1.4 线段属性与描边操作（stroke）103
4.1.5 虚线绘制（交替绘制线段）105
4.1.6 使用颜色描边和填充108
4.1.7 使用渐变对象描边和填充110
4.1.8 使用图案对象描边和填充113
4.1.9 后续要用到的一些常用绘制方法115
4.2 绘制文本117
4.2.1 封装fillText方法117
4.2.2 文本的对齐方式119
4.2.3 自行实现文本对齐效果121
4.2.4 计算文本高度算法122
4.2.5 嵌套矩形定位算法122
4.2.6 fillRectWithTitle方法的实现125
4.2.7 自行文本对齐实现Demo126
4.2.8 font属性128
4.2.9 实现makeFontString辅助方法129
4.3 绘制图像130