第1章 Vue.js简介 1
1.1 什么是Vue.js 1
1.2 Vue.js简史 2
第一篇 变化侦测
第2章 Object的变化侦测 6
2.1 什么是变化侦测 6
2.2 如何追踪变化 7
2.3 如何收集依赖 7
2.4 依赖收集在哪里 8
2.5 依赖是谁 10
2.6 什么是Watcher 10
2.7 递归侦测所有key 12
2.8 关于Object的问题 13
2.9 总结 14
第3章 Array的变化侦测 16
3.1 如何追踪变化 16
3.2 拦截器 17
3.3 使用拦截器覆盖Array原型 18
3.4 将拦截器方法挂载到数组的属性上 19
3.5 如何收集依赖 21
3.6 依赖列表存在哪儿 22
3.7 收集依赖 23
3.8 在拦截器中获取Observer实例 24
3.9 向数组的依赖发送通知 25
3.10 侦测数组中元素的变化 26
3.11 侦测新增元素的变化 27
3.11.1 获取新增元素 27
3.11.2 使用Observer侦测新增元素 28
3.12 关于Array的问题 29
3.13 总结 29
第4章 变化侦测相关的API实现原理 31
4.1 vm.$watch 31
4.1.1 用法 31
4.1.2 watch的内部原理 32
4.1.3 deep参数的实现原理 36
4.2 vm.$set 38
4.2.1 用法 38
4.2.2 Array的处理 39
4.2.3 key已经存在于target中 40
4.2.4 处理新增的属性 40
4.3 vm.$delete 41
4.3.1 用法 42
4.3.2 实现原理 42
4.4 总结 45
第二篇 虚拟DOM
第5章 虚拟DOM简介 48
5.1 什么是虚拟DOM 48
5.2 为什么要引入虚拟DOM 51
5.3 Vue.js中的虚拟DOM 51
5.4 总结 53
第6章 VNode 54
6.1 什么是VNode 54
6.2 VNode的作用 55
6.3 VNode的类型 56
6.3.1 注释节点 57
6.3.2 文本节点 57
6.3.3 克隆节点 57
6.3.4 元素节点 58
6.3.5 组件节点 59
6.3.6 函数式组件 59
6.4 总结 59
第7章 patch 60
7.1 patch介绍 60
7.1.1 新增节点 61
7.1.2 删除节点 62
7.1.3 更新节点 63
7.1.4 小结 63
7.2 创建节点 64
7.3 删除节点 67
7.4 更新节点 68
7.4.1 静态节点 68
7.4.2 新虚拟节点有文本属性 69
7.4.3 新虚拟节点无文本属性 69
7.4.4 小结 70
7.5 更新子节点 72
7.5.1 更新策略 72
7.5.2 优化策略 77
7.5.3 哪些节点是未处理过的 82
7.5.4 小结 83
7.6 总结 86
第三篇 模板编译原理
第8章 模板编译 88
8.1 概念 88
8.2 将模板编译成渲染函数 89
8.2.1 解析器 90
8.2.2 优化器 91
8.2.3 代码生成器 91
8.3 总结 92
第9章 解析器 93
9.1 解析器的作用 93
9.2 解析器内部运行原理 94
9.3 HTML解析器 99
9.3.1 运行原理 100
9.3.2 截取开始标签 101
9.3.3 截取结束标签 107
9.3.4 截取注释 108
9.3.5 截取条件注释 108
9.3.6 截取DOCTYPE 109
9.3.7 截取文本 109
9.3.8 纯文本内容元素的处理 112
9.3.9 使用栈维护DOM层级 114
9.3.10 整体逻辑 114
9.4 文本解析器 117
9.5 总结 121
第10章 优化器 122
10.1 找出所有静态节点并标记 125
10.2 找出所有静态根节点并标记 127
10.3 总结 129
第11章 代码生成器 130
11.1 通过AST生成代码字符串 131
11.2 代码生成器的原理 134
11.2.1 元素节点 134
11.2.2 文本节点 136
11.2.3 注释节点 137
11.3 总结 137
第四篇 整体流程
第12章 架构设计与项目结构 140
12.1 目录结构 140
12.2 架构设计 143
12.3 总结 145
第13章 实例方法与全局API的实现原理 146
13.1 数据相关的实例方法 147
13.2 事件相关的实例方法 147
13.2.1 vm.$on 148
13.2.2 vm.$off 149
13.2.3 vm.$once 152
13.2.4 vm.$emit 153
13.3 生命周期相关的实例方法 154
13.3.1 vm.$forceUpdate 154
13.3.2 vm.$destroy 155
13.3.3 vm.$nextTick 159
13.3.4 vm.$mount 169
13.4 全局API的实现原理 178
13.4.1 Vue.extend 178
13.4.2 Vue.nextTick 182
13.4.3 Vue.set 183
13.4.4 Vue.delete 183
13.4.5 Vue.directive 184
13.4.6 Vue.filter 185
13.4.7 Vue.component 186
13.4.8 Vue.use 188
13.4.9 Vue.mixin 189
13.4.10 Vue.compile 190
13.4.11 Vue.version 190
13.5 总结 191
第14章 生命周期 192
14.1 生命周期图示 192
14.1.1 初始化阶段 193
14.1.2 模板编译阶段 194
14.1.3 挂载阶段 194
14.1.4 卸载阶段 194
14.1.5 小结 194
14.2 从源码角度了解生命周期 195
14.3 errorCaptured与错误处理 199
14.4 初始化实例属性 203
14.5 初始化事件 204
14.6 初始化inject 208
14.6.1 provide/inject的使用方式 208
14.6.2 inject的内部原理 210
14.7 初始化状态 215
14.7.1 初始化props 216
14.7.2 初始化methods 224
14.7.3 初始化data 225
14.7.4 初始化computed 228
14.7.5 初始化watch 238
14.8 初始化provide 241
14.9 总结 241
第15章 指令的奥秘 242
15.1 指令原理概述 242
15.1.1 v-if指令的原理概述 243
15.1.2 v-for指令的原理概述 243
15.1.3 v-on指令 244
15.2 自定义指令的内部原理 246
15.3 虚拟DOM钩子函数 250
15.4 总结 251
第16章 过滤器的奥秘 252
16.1 过滤器原理概述 253
16.1.1 串联过滤器 254
16.1.2 滤器接收参数 254
16.1.3 resolveFilter的内部原理 255
16.2 解析过滤器 256
16.3 总结 258
第17章 最佳实践 259
17.1 为列表渲染设置属性key 259
17.2 在v-if/v-if-else/v-else中使用key 259
17.3 路由切换组件不变 260
17.3.1 路由导航守卫beforeRouteUpdate 261
17.3.2 观察 $route对象的变化 261
17.3.3 为router-view组件添加属性key 262
17.4 为所有路由统一添加query 262
17.4.1 使用全局守卫beforeEach 263
17.4.2 使用函数劫持 263
17.5 区分Vuex与props的使用边界 264
17.6 避免v-if和v-for一起使用 264
17.7 为组件样式设置作用域 266
17.8 避免在scoped中使用元素选择器 267
17.9 避免隐性的父子组件通信 268
17.10 单文件组件如何命名 268
17.10.1 单文件组件的文件名的大小写 268
17.10.2 基础组件名 269
17.10.3 单例组件名 270
17.10.4 紧密耦合的组件名 270
17.10.5 组件名中的单词顺序 271
17.10.6 完整单词的组件名 272
17.10.7 组件名为多个单词 273
17.10.8 模板中的组件名大小写 273
17.10.9 JS/JSX中的组件名大小写 274
17.11 自闭合组件 275
17.12 prop名的大小写 276
17.13 多个特性的元素 276
17.14 模板中简单的表达式 276
17.15 简单的计算属性 277
17.16 指令缩写 278
17.17 良好的代码顺序 278
17.17.1 组件/实例的选项的顺序 278
17.17.2 元素特性的顺序 280
17.17.3 单文件组件顶级元素的顺序 281
17.18 总结 282
· · · · · · (收起)
1.1 什么是Vue.js 1
1.2 Vue.js简史 2
第一篇 变化侦测
第2章 Object的变化侦测 6
2.1 什么是变化侦测 6
2.2 如何追踪变化 7
2.3 如何收集依赖 7
2.4 依赖收集在哪里 8
2.5 依赖是谁 10
2.6 什么是Watcher 10
2.7 递归侦测所有key 12
2.8 关于Object的问题 13
2.9 总结 14
第3章 Array的变化侦测 16
3.1 如何追踪变化 16
3.2 拦截器 17
3.3 使用拦截器覆盖Array原型 18
3.4 将拦截器方法挂载到数组的属性上 19
3.5 如何收集依赖 21
3.6 依赖列表存在哪儿 22
3.7 收集依赖 23
3.8 在拦截器中获取Observer实例 24
3.9 向数组的依赖发送通知 25
3.10 侦测数组中元素的变化 26
3.11 侦测新增元素的变化 27
3.11.1 获取新增元素 27
3.11.2 使用Observer侦测新增元素 28
3.12 关于Array的问题 29
3.13 总结 29
第4章 变化侦测相关的API实现原理 31
4.1 vm.$watch 31
4.1.1 用法 31
4.1.2 watch的内部原理 32
4.1.3 deep参数的实现原理 36
4.2 vm.$set 38
4.2.1 用法 38
4.2.2 Array的处理 39
4.2.3 key已经存在于target中 40
4.2.4 处理新增的属性 40
4.3 vm.$delete 41
4.3.1 用法 42
4.3.2 实现原理 42
4.4 总结 45
第二篇 虚拟DOM
第5章 虚拟DOM简介 48
5.1 什么是虚拟DOM 48
5.2 为什么要引入虚拟DOM 51
5.3 Vue.js中的虚拟DOM 51
5.4 总结 53
第6章 VNode 54
6.1 什么是VNode 54
6.2 VNode的作用 55
6.3 VNode的类型 56
6.3.1 注释节点 57
6.3.2 文本节点 57
6.3.3 克隆节点 57
6.3.4 元素节点 58
6.3.5 组件节点 59
6.3.6 函数式组件 59
6.4 总结 59
第7章 patch 60
7.1 patch介绍 60
7.1.1 新增节点 61
7.1.2 删除节点 62
7.1.3 更新节点 63
7.1.4 小结 63
7.2 创建节点 64
7.3 删除节点 67
7.4 更新节点 68
7.4.1 静态节点 68
7.4.2 新虚拟节点有文本属性 69
7.4.3 新虚拟节点无文本属性 69
7.4.4 小结 70
7.5 更新子节点 72
7.5.1 更新策略 72
7.5.2 优化策略 77
7.5.3 哪些节点是未处理过的 82
7.5.4 小结 83
7.6 总结 86
第三篇 模板编译原理
第8章 模板编译 88
8.1 概念 88
8.2 将模板编译成渲染函数 89
8.2.1 解析器 90
8.2.2 优化器 91
8.2.3 代码生成器 91
8.3 总结 92
第9章 解析器 93
9.1 解析器的作用 93
9.2 解析器内部运行原理 94
9.3 HTML解析器 99
9.3.1 运行原理 100
9.3.2 截取开始标签 101
9.3.3 截取结束标签 107
9.3.4 截取注释 108
9.3.5 截取条件注释 108
9.3.6 截取DOCTYPE 109
9.3.7 截取文本 109
9.3.8 纯文本内容元素的处理 112
9.3.9 使用栈维护DOM层级 114
9.3.10 整体逻辑 114
9.4 文本解析器 117
9.5 总结 121
第10章 优化器 122
10.1 找出所有静态节点并标记 125
10.2 找出所有静态根节点并标记 127
10.3 总结 129
第11章 代码生成器 130
11.1 通过AST生成代码字符串 131
11.2 代码生成器的原理 134
11.2.1 元素节点 134
11.2.2 文本节点 136
11.2.3 注释节点 137
11.3 总结 137
第四篇 整体流程
第12章 架构设计与项目结构 140
12.1 目录结构 140
12.2 架构设计 143
12.3 总结 145
第13章 实例方法与全局API的实现原理 146
13.1 数据相关的实例方法 147
13.2 事件相关的实例方法 147
13.2.1 vm.$on 148
13.2.2 vm.$off 149
13.2.3 vm.$once 152
13.2.4 vm.$emit 153
13.3 生命周期相关的实例方法 154
13.3.1 vm.$forceUpdate 154
13.3.2 vm.$destroy 155
13.3.3 vm.$nextTick 159
13.3.4 vm.$mount 169
13.4 全局API的实现原理 178
13.4.1 Vue.extend 178
13.4.2 Vue.nextTick 182
13.4.3 Vue.set 183
13.4.4 Vue.delete 183
13.4.5 Vue.directive 184
13.4.6 Vue.filter 185
13.4.7 Vue.component 186
13.4.8 Vue.use 188
13.4.9 Vue.mixin 189
13.4.10 Vue.compile 190
13.4.11 Vue.version 190
13.5 总结 191
第14章 生命周期 192
14.1 生命周期图示 192
14.1.1 初始化阶段 193
14.1.2 模板编译阶段 194
14.1.3 挂载阶段 194
14.1.4 卸载阶段 194
14.1.5 小结 194
14.2 从源码角度了解生命周期 195
14.3 errorCaptured与错误处理 199
14.4 初始化实例属性 203
14.5 初始化事件 204
14.6 初始化inject 208
14.6.1 provide/inject的使用方式 208
14.6.2 inject的内部原理 210
14.7 初始化状态 215
14.7.1 初始化props 216
14.7.2 初始化methods 224
14.7.3 初始化data 225
14.7.4 初始化computed 228
14.7.5 初始化watch 238
14.8 初始化provide 241
14.9 总结 241
第15章 指令的奥秘 242
15.1 指令原理概述 242
15.1.1 v-if指令的原理概述 243
15.1.2 v-for指令的原理概述 243
15.1.3 v-on指令 244
15.2 自定义指令的内部原理 246
15.3 虚拟DOM钩子函数 250
15.4 总结 251
第16章 过滤器的奥秘 252
16.1 过滤器原理概述 253
16.1.1 串联过滤器 254
16.1.2 滤器接收参数 254
16.1.3 resolveFilter的内部原理 255
16.2 解析过滤器 256
16.3 总结 258
第17章 最佳实践 259
17.1 为列表渲染设置属性key 259
17.2 在v-if/v-if-else/v-else中使用key 259
17.3 路由切换组件不变 260
17.3.1 路由导航守卫beforeRouteUpdate 261
17.3.2 观察 $route对象的变化 261
17.3.3 为router-view组件添加属性key 262
17.4 为所有路由统一添加query 262
17.4.1 使用全局守卫beforeEach 263
17.4.2 使用函数劫持 263
17.5 区分Vuex与props的使用边界 264
17.6 避免v-if和v-for一起使用 264
17.7 为组件样式设置作用域 266
17.8 避免在scoped中使用元素选择器 267
17.9 避免隐性的父子组件通信 268
17.10 单文件组件如何命名 268
17.10.1 单文件组件的文件名的大小写 268
17.10.2 基础组件名 269
17.10.3 单例组件名 270
17.10.4 紧密耦合的组件名 270
17.10.5 组件名中的单词顺序 271
17.10.6 完整单词的组件名 272
17.10.7 组件名为多个单词 273
17.10.8 模板中的组件名大小写 273
17.10.9 JS/JSX中的组件名大小写 274
17.11 自闭合组件 275
17.12 prop名的大小写 276
17.13 多个特性的元素 276
17.14 模板中简单的表达式 276
17.15 简单的计算属性 277
17.16 指令缩写 278
17.17 良好的代码顺序 278
17.17.1 组件/实例的选项的顺序 278
17.17.2 元素特性的顺序 280
17.17.3 单文件组件顶级元素的顺序 281
17.18 总结 282
· · · · · · (收起)
具体描述
本書從源碼層麵分析瞭Vue.js。首先，簡要介紹瞭Vue.js；然後詳細講解瞭其內部核心技術“變化偵測”，這裏帶領大傢從0到1實現一個簡單的“變化偵測”係統；接著詳細介紹瞭虛擬DOM技術，其中包括虛擬DOM的原理及其patching算法；緊接著詳細討論瞭模闆編譯技術，其中包括模闆解析器的實現原理、優化器的原理以及代碼生成器的原理；最後詳細介紹瞭其整體架構以及提供給我們使用的各種API的內部原理，同時還介紹瞭生命周期、錯誤處理、指令係統與模闆過濾器等功能的原理。
本書適閤前端開發人員閱讀。
用户评价
评分
##今天特意来看完，上周五翻遍南山书城就只有这本关于vue的，这本书一拿起以为是跟其他的白开水的框架书一样，但是看了前面的双向数据绑定原理后，这本书对vue框架的原理真的是深入浅出。之前有些没思考到的有提及到，算是全面补充了一些知识面，不过就应用场景来说缺乏了一点，
评分##对于我总感觉基础小白来说真是一脸懵逼
评分##老话说，如果一个框架设计得好，你是不用去读源码的（狗头。第一章讲对象和数组劫持给我讲懵了，明显是个设计缺陷（vue3里就改掉了），后面watch/di/tick好多都是我大ng1的设计。唉可惜我厂vue者众，这说明什么呢
评分##挺不错了，虽然有这地方有点冗余，但很适合我这样的初学者
评分##对于我总感觉基础小白来说真是一脸懵逼
评分##读第一章就有恍然大明白的感觉 i了i了
评分##确实是深入浅出，用很简短的代码就呈现了一个近乎完整的模板解析过程，但由于 Vue2 其它部分代码更简单一些，其它章节读起来就稍显乏味了。希望在新书中看到更多作者对软件设计、软件工程相关的理解。
评分##大概翻了翻，主要是了解一下vue的实现原理。整体来说主要是三块，变化监测，虚拟dom，模板编译。我这个后端的同学也可以轻松看明白，写的还是挺不错的。
评分##大概翻了翻，主要是了解一下vue的实现原理。整体来说主要是三块，变化监测，虚拟dom，模板编译。我这个后端的同学也可以轻松看明白，写的还是挺不错的。
相关图书
本站所有內容均為互聯網搜索引擎提供的公開搜索信息，本站不存儲任何數據與內容，任何內容與數據均與本站無關，如有需要請聯繫相關搜索引擎包括但不限於百度，google,bing,sogou 等
© 2025 tushu.tinynews.org All Rights Reserved. 求知書站 版权所有