摘要：
什么是依赖？ vue1.x，细粒度依赖，用到数据的 DOM 都是依赖； Vue2.x，中等粒度依赖，用到数据的 组件 是依赖； 在 getter 中收集依赖，在 setter 中触发依赖 把依赖收集的代码封装成一个Dep类，它专门用来管理依赖，每个Observer的实例，成员中都有一个Dep的实例； 阅读全文
摘要：
vue 改写了数组的七个方法：push、pop、shift、unshift、splice、sort、reverse。使数组改变的时候能够触发响应式，先把原来的 Array.prototype 的方法备份一份，再进行重写。 vue 的数组响应式是如何实现的？ 以 Array.prototype 为原型 阅读全文
摘要：
官网的响应式原理图解： 三种框架的数据变化类型： Object.defineProperty() 方法： Object.defineReactive() 方法： let obj = {}; function defineReactive(data, key, val) { Object.define 阅读全文
摘要：
这一篇来讲五角星部分，diff算法最精华的内容： 子节点更新策略 一、经典的diff算法优化策略 四种命中查找：（按照顺序排列）（四个指针） 命中一种就不再继续往下命中判断了 如果当前没有命中，就继续往下命中判断 如果都没有命中，就只能用循环来寻找了 1. 新前与旧前 2. 新后与旧后 3. 新后与 阅读全文
摘要：
一、感受 diff 算法 当父节点发生改变时，比如 ul 变为 ol ，里面的 li 不发生改变，diff 算法是会暴力删除的。 2. diff 算法处理新旧节点不是同一个节点时。 snabbdom 判断是否是相同的虚拟节点： 创建节点时，所有子节点需要递归创建的。 二、手写第一次上树时 1. 目录 阅读全文
摘要：
h 函数支持以下写法，此次手写 h 函数，只支持后面 3 种写法（低配版） 文件结构： vnode.js // 函数的功能非常简单，就是透传参数 export default function (sel, data, children, text, elm) { return { sel, data 阅读全文
摘要：
1. 安装 npm init npm i -S snabbdom webpack配置虚拟打包路径： 运行git首页的 snabbdom 示例代码：（放到 index.js 中）： index.html 里要放一个 id 为 container 的 div： 将这两个函数先替换成 空函数： 代码运行成 阅读全文
摘要：
typeScript 中的泛型 1. 泛型的定义 泛型：软件工程中，我们不仅要创建一致的定义良好的API，同时也要考虑可重用性。组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型，这在创建大型系统时为你提供了十分灵活的功能。 在像 C# 和 Java 这样的语言中，可以使用泛型来创建可重用的 阅读全文
摘要：
接口的作用： 在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范，在程序设计里面，接口起到一种限制和规范的作用。接口定义了某一批类所需要遵守的规范，接口不关心这些类的内部状态数据，也不关心这些类里方法的实现细节，它只规定这批类里必须提供某些方法，提供这些方法的类就可以满足实际需要。 阅读全文
摘要：
1. ts 中类的定义 es5： function Person(name) { this.name = name; this.run = function() { console.log(this.name) } } var p = new Person('张三') p.run() 1.1 ts 阅读全文