上篇文章浅析Vue源码（四）—— $mount中template的编译--parse，我们介绍了compile 的 parse部分，至此我们完成了对一个html字符串模板解析成一个AST语法树的过程。下一步就是我们需要通过optimize方法，将AST节点进行静态节点标记。为后…

在未出现双向绑定之前，我们需要在各个触发事件方法中直接操作DOM节点来达到修改相应视图的目的。但是当应用一大就会变得难以维护，reflow(回流)很影响性能的。 因此就有人提出来，那我们是不是可以把真实DOM树抽象成一棵以JavaScript对象构成的抽象树，在修改抽象树数据后…

这一章主要讲的是在render的时候如何做到对data中元素进行依赖的收集与监听。 按照之前我们理解的data中依赖收集与监听方法进行绑定则会出现一个问题——span3在实际模板中并没有被用到，然而当span3的数据被修改的时候（this.span3 = 'span4'）的时候…

parse，optimize函数的功能，这里，我们主要介绍generate。 generate 函数主要功能就是根据 AST 结构拼接生成 render function 的字符串。 其中 genElement 函数是什么呢？--是会根据 AST 的属性调用不同的方法生成字符串…

通过mount编译代码我们清晰的了解到，在mount的过程中，如果render函数不存在（render函数存在会优先使用render）会将template进行compileToFunctions得到render以及staticRenderFns。譬如说手写组件时加入了templ…

在了解之前，首选我们需要了解一下响应式数据原理，也就是我们常说的：订阅-发布 模式。 这个函数定义在core文件下observer的index.js文件中，传送地址。 Vue的响应式数据都会有一个__ob__的属性作为标记，里面存放了该属性的观察器，也就是Observer的实例…

从上面一点一点注释可以看出，主要是为我们的Vue原型上定义一个方法_init。然后当我们执行new Vue(options) 的时候，会调用这个方法。而这个_init方法的实现，便是我们需要关注的地方。 前面定义vm实例都挺好理解的，主要我们来看一下mergeOptions这个…

声明：英文注解为尤雨溪大神原著，中文为本人理解翻译。水平有限若理解有误请以原著为准，望指正，见谅哈~ 那么在这次实例化的过程中，究竟发生了哪些行为？让我们来一探究竟。打开Vue的源码文件，其核心代码在src/core目录下。下面我们从入口文件index.js开始进入： 这里简单…

近期不断面试中，面试官都会提一些关于Vue相关的源码和“全家桶”之类的问题。那么针对这些提问，我们应该如何更好应答呢？在这里我把对Vue的理解整理出来供大家来参考。 Vue是一套构建用户界面的渐进式框架，也是一个非常典型的 MVVM 的程序结构（model-view-viewm…