写在前面本篇是从零实现 vue2 系列第七篇，在 YourVue 中实现 v-if 和 v-for。文章会最先更新在公众号：BUPPT。代码仓库：https://github.com/b...

写在前面本篇是从零实现 vue2 系列第四篇，为 YourVue 添加虚拟 dom。之前在第一篇实现 vue 流程的时候，将模版解析成 ast，直接生成了真实 dom。这并不是 vue 的实现方式，真正的实现方式是将 parse(template) 生成的 ast 通过 gencode 生成 render 函数，然后执行 render 函数生成 VNode，构建虚拟 dom 树，然后通过虚拟 dom 树创建真实 dom。代码仓库：https://github.com/buppt/YourVue正文

写在前面本篇是从零实现 vue2 系列第三篇，为 YourVue 添加数组监听。文章会最先更新在公众号：BUPPT。代码仓库：https://github.com/buppt/YourVue正文上一篇我们实现了双向绑定，篇幅原因没有处理数组。我们知道 vue 是通过重写了几个数组的方法实现的数组监听，先在 Observer 中添加几行代码。class Observer{ constructor(value) { this.value = value this

写在前面本篇是从零实现 vue2 系列第二篇，为 YourVue 添加双向绑定。双向绑定大家可能都比较熟悉来，如果你能回答出下面几个问题，就可以跳过看下一篇了：vue2 通过 Object.defineProperty 修改 get 和 set 方法，实现订阅发布。为什么要用栈结构的 Dep.target 来存储当前 watcher ？为什么 watcher 每次更新后要 cleanupDeps，以及是如何 cleanupDeps 的？代码仓库：https://github.com/buppt

写在前面vue3 马上要来了，vue2 学会了吗？最近看到了不少类似标题的文章，虽然 vue 的双向绑定、虚拟dom、diff算法等等面试常见问题你可能在几年前就学过了，不过让从零开始实现一个 vue，你可以吗。本着学习的最好方法就是自己实现一次的原则，趁着疫情无法返校，计划实现一个尽量完整的 vue，删掉了 flow 和很多的类型判断，只保留各功能的主流程，旨在为直接阅读 vue 源码提供过渡。毕竟 vue 源码还是比较难啃的，看网上的文章也很难将各个模块联系起来。跟着我先搭起整个框架，然后一个功