浅谈Vue中computed

1、computed特性: 计算属性在使用的时候，要当做普通属性使用就好，不需要加（） 只要计算属性这个function内部所用到的data中的数据发生了变化，就会立即重新计算这个计算属性的值 计算属性的求值结果，会被缓存起来，方便下次继续使用；如果计算属性方法中，所依赖的任何数据，都没有发生过变化，则不会重新对计算属性求值 可以为函数或者对象 2.computed原理是什么： 学习中最常见听到的一句话就是，computed就是一个特殊的getter方法。在代理函数可以结合watcher实现缓存与收集依赖。 1）计算属性具有缓存性，如何知道计算属性的返回值发生变化呢？ 这其实就是结合了watcher的dirty属性来分辨的，当dirty为true时，说明需要重新计算，当为false时，计算属性没有改变，不需要重新计算，直接读取缓存值就好。 2）模拟一下计算属性内容发生改变后： 计算属性的watcher和组件内的watcher都会得到通知 计算属性的watcher将自己的属性dirty设置为true 下次读取计算属性时，因为dirty为true重新计算一次值 组件watcher得到通知，从而执行render函数进行重新渲染 3.详说整个computed过程： 使用watcher读取计算属性 读取计算属性函数中的数据，定义响应式时，get读取的就是watcher.value 计算属性和组件watcher同时观察数据的变化 当数据改变后，计算属性和组件watcher都会收到通知 组件watcher会重新渲染组件 计算属性watcher因为数据改变，dirty属性为true,将重新计算 计算属性计算的结果用于本次渲染，并缓存起来 5.面试题：watch和computed的区别是什么？ 其实我觉得这两个作用是完全不一样，不知道为什么总拿来比较。 watch是一种行为，在状态改变之后需要做什么。 computed就是一种状态，也可以说多种状态初始化后的结果。 我认为把，computed与filter作为比较不是更好一些吗？都是用来初始化状态用的。 computed更适用于大量数据计算的结果，并且反复使用，而且不常更新。因为有缓存，大大提升性能。 filter适用于少量数据进行初始化处理，计算量不能太大，因为每次渲染都会计算，并且可以频繁更新。