computed: 计算属性
- 依赖其他属性计算值，
- computed 的值有缓存，
- 当计算值变化才会返回内容，
- 可以设置 getter 和 setter。
watch: 监听到值的变化就会执行回调，在回调中可以进行一些逻辑操作。
应用场景：computed与vuex结合，刷新视图
computed： 一般用在模板渲染中，某个值是依赖了其它的响应式对象甚至是计算属性计算而来；
watch： 侦听属性适用于观测某个值的变化去完成一段复杂的业务逻辑
computed: 计算属性原理
- 对计算属性进行属性劫持
利用Object.defineProperty来对计算属性的get和set进行劫持 Object.defineProperty(target, key, sharedPropertyDefinition);
2.重写计算属性的get方法 来判断是否需要进行重新计算
function createComputedGetter(key) { ... }
3.Watcher 改造
实例化的时候如果是计算属性 不会去调用 get 方法访问值进行依赖收集
update 方法只是把计算 watcher 的 dirty 标识为 true 只有当下次访问到了计算属性的时候才会重新计算
新增 evaluate 方法专门用于计算属性重新计算
新增 depend 方法 让计算属性的依赖值收集外层 watcher--这个方法非常重要 我们接下来分析
- 外层 Watcher 的依赖收集 当计算属性重新计算之后就立马会出栈 那么外层的 watcher 就会成为新的 Dep.target 我们使用 watcher.depend 方法让计算属性依赖的值收集一遍外层的渲染 watcher 这样子当计算属性依赖的值改变了既可以重新计算又可以刷新视图
