编辑推荐
引导读者了解近10年来大师们打造的优良框架以及其中令人称道的奇思妙想更深入、更彻底地认识JavaScript,领略jQuery等库的架构之美和设计之美帮助开发者高屋建瓴地打造适合自己的前端框架
内容简介
内容 提 要本书全面讲解了JavaScript框架设计及相关的知识,主要内容包括种子模块、语言模块、浏览器嗅探与特征侦测、类工厂、选择器引擎、节点模块、数据缓存模块、样式模块、属性模块、PC端和移动端的事件系统、jQuery的事件系统、异步模型、数据交互模块、动画引擎、MVVM、前端模板(静态模板)、MVVM的动态模板、性能墙与复杂墙、组件、jQuery时代的组件方案、avalon2的组件方案、react的组件方案等。本书适合前端设计人员、JavaScript开发者、移动UI设计者、程序员和项目经理阅读,也可作为相关专业学习用书和培训学校教材。
作者简介
钟钦成 网名司徒正美,著名的JavaScript专家,立志做考古学家的日语系工程师,穿梭于二次元与二进制间的“魔法师”,做过陶艺,写过小说,涉猎Java、Ruby、 JavaScript,3年成就此书!
目录
- 第1章 种子模块 1
- 1.1 模块化 1
- 1.2 功能介绍 2
- 1.3 对象扩展 3
- 1.4 数组化 5
- 1.5 类型的判定 8
- 1.5.1 type 12
- 1.5.2 isPlainObject 13
- 1.5.3 isWindow 14
- 1.5.4 isNumeric 15
- 1.5.5 isArrayLike 16
- 1.6 domReady 17
- 1.7 无冲突处理 20
- 1.8 总结 20
- 第2章 语言模块 21
- 2.1 字符串的扩展与修复 22
- 2.1.1 repeat 24
- 2.1.2 byteLen 26
- 2.1.3 pad 30
- 2.1.4 quote 32
- 2.1.5 trim与空白 33
- 2.2 数组的扩展与修复 37
- 2.3 数值的扩展与修复 45
- 2.4 函数的扩展与修复 48
- 2.5 日期的扩展与修复 53
- 第3章 浏览器嗅探与特征侦测 57
- 3.1 浏览器判定 58
- 3.2 document.all趣闻 61
- 3.3 事件的支持侦测 62
- 3.4 样式的支持侦测 65
- 3.5 jQuery一些常用特征的含义 65
- 第4章 类工厂 68
- 4.1 JavaScript对类的支撑 68
- 4.2 各种类工厂的实现 73
- 4.2.1 相当精巧的库—P.js 74
- 4.2.2 JS.Class 76
- 4.2.3 simple-inheritance 78
- 4.2.4 体现JavaScript灵活性的库—def.js 81
- 4.3 进击的属性描述符 85
- 4.4 真类降临 93
- 第5章 选择器引擎 102
- 5.1 浏览器内置的寻找元素的方法 103
- 5.2 getElementsBySelector 105
- 5.3 选择器引擎涉及的知识点 108
- 5.3.1 关系选择器 109
- 5.3.2 伪类 111
- 5.3.3 其他概念 113
- 5.4 选择器引擎涉及的通用函数 114
- 5.4.1 isXML 114
- 5.4.2 contains 115
- 5.4.3 节点排序与去重 117
- 5.4.4 切割器 121
- 5.4.5 属性选择器对于空白字符的匹配策略 123
- 5.4.6 子元素过滤伪类的分解与匹配 125
- 5.5 Sizzle引擎 127
- 5.6 总结 135
- 第6章 节点模块 136
- 6.1 节点的创建 136
- 6.2 节点的插入 142
- 6.3 节点的复制 144
- 6.4 节点的移除 148
- 6.5 节点的移除回调实现 151
- 6.5.1 Mutation Observer 152
- 6.5.2 更多候选方案 153
- 6.6 innerHTML、innerText、outerHTML、outerText的兼容处理 157
- 6.7 模板容器元素 161
- 6.8 *元素 162
- 6.9 总结 165
- 第7章 数据缓存模块 166
- 7.1 jQuery的第1代缓存系统 166
- 7.2 jQuery的第2代缓存系统 172
- 7.3 jQuery的第3代缓存系统 175
- 7.4 有容量限制的缓存系统 176
- 7.5 本地存储系统 178
- 7.6 总结 184
- 第8章 样式模块 185
- 8.1 主体架构 186
- 8.2 样式名的修正 189
- 8.3 个别样式的特殊处理 190
- 8.3.1 opacity 190
- 8.3.2 user-select 192
- 8.3.3 background-position 192
- 8.3.4 z-index 193
- 8.3.5 盒子模型 194
- 8.3.6 元素的尺寸 195
- 8.3.7 元素的显隐 201
- 8.3.8 元素的坐标 203
- 8.4 元素的滚动条的坐标 209
- 8.5 总结 210
- 第9章 属性模块 211
- 9.1 元素节点的属性 212
- 9.2 如何区分固有属性与自定义属性 214
- 9.3 如何判定浏览器是否区分固有属性与自定义属性 216
- 9.4 IE的属性系统的3次演变 217
- 9.5 className的操作 218
- 9.6 Prototype.js的属性系统 221
- 9.7 jQuery的属性系统 226
- 9.8 avalon的属性系统 229
- 9.9 value的操作 232
- 9.10 总结 235
- 第10章 PC端的事件系统 236
- 10.1 原生API简介 238
- 10.2 on×××绑定方式的缺陷 239
- 10.3 attachEvent的缺陷 239
- 10.4 addEventListener的缺陷 241
- 10.5 handleEvent与EventListenerOptions 242
- 10.6 Dean Edward大神的addEvent.js源码分析 243
- 10.7 jQuery的事件系统 246
- 10.8 avalon2的事件系统 248
- 10.9 总结 254
- 第11章 移动端的事件系统 255
- 11.1 touch系事件 256
- 11.2 gesture系事件 258
- 11.3 tap系事件 259
- 11.4 press系事件 268
- 11.5 swipe系事件 271
- 11.6 pinch系事件 273
- 11.7 拖放系事件 276
- 11.8 rotate系事件 279
- 11.9 总结 282
- 第12章 异步模型 283
- 12.1 setTimeout与setInterval 284
- 12.2 Promise诞生前的世界 287
- 12.2.1 回调函数callbacks 287
- 12.2.2 观察者模式observers 287
- 12.2.3 事件机制listeners 289
- 12.3 JSDeferred里程碑 289
- 12.4 jQuery Deferred宣教者 299
- 12.5 es6 PromiseDIYI个标准模型 303
- 12.5.1 构造函数:Promise( executor ) 308
- 12.5.2 Promise.resolve/reject 309
- 12.5.3 Promise.all/race 309
- 12.5.4 Promise#then/catch 310
- 12.5.5 Promise#resolve/reject 310
- 12.5.6 Promsie#notify 311
- 12.5.7 nextTick 312
- 12.6 es6生成器过渡者 314
- 12.6.1 关键字yield 315
- 12.6.2 yield*和yield的区别 316
- 12.6.3 异常处理 317
- 12.7 es7 async/awaitzhongji方案 319
- 12.8 总结 321
- 第13章 数据交互模块 323
- 13.1 Ajax概览 323
- 13.2 优雅地取得XMLHttpRequest对象 324
- 13.3 XMLHttpRequest对象的事件绑定与状态维护 326
- 13.4 发送请求与数据 328
- 13.5 接收数据 330
- 13.6 上传文件 333
- 13.7 jQuery.ajax 335
- 13.8 fetch,下一代Ajax 340
- 第14章 动画引擎 344
- 14.1 动画的原理 344
- 14.2 缓动公式 347
- 14.3 jQuery.animate 349
- 14.4 mass Framework基于JavaScript的动画引擎 350
- 14.5 requestAnimationFrame 358
- 14.6 CSS3 transition 364
- 14.7 CSS3 animation 368
- 14.8 mass Framework基于CSS的动画引擎 370
- 第15章 MVVM 378
- 15.1 前端模板(静态模板) 378
- 15.2 MVVM的动态模板 388
- 15.2.1 求值函数 390
- 15.2.2 刷新函数 395
- 15.3 ViewModel 399
- 15.3.1 Proxy 400
- 15.3.2 Reflect 401
- 15.3.3 avalon的ViewModel设计 403
- 15.3.4 angular的ViewModel设计 407
- 15.4 React与虚拟DOM 412
- 15.4.1 React的diff算法 415
- 15.4.2 React的多端渲染 417
- 15.5 性能墙与复杂墙 417
- 第16章 组件 422
- 16.1 jQuery时代的组件方案 422
- 16.2 avalon2的组件方案 427
- 16.2.1 组件容器 429
- 16.2.2 配置对象 430
- 16.2.3 slot机制 430
- 16.2.4 soleSlot机制 431
- 16.2.5 生命周期 432
- 16.3 React的组件方案 433
- 16.3.1 React组件的各种定义方式 433
- 16.3.2 React组件的生命周期 439
- 16.3.3 React组件间通信 441
- 16.3.4 React组件的分类 445
- 16.4 前端路由 446
- 16.4.1 storage 447
- 16.4.2 mmHistory 448
- 16.4.3 mmRouter 454
- 彩蛋 458