当前位置: 首页 > Web前端 > vue.js

浅谈Vue中的computed

时间:2023-03-31 19:39:01 vue.js

1.Computed特性:在使用computed属性时,应该作为普通属性使用,不用加()只要computed属性的函数中使用的data中的数据发生了变化即可,计算属性的值将立即重新计算。计算属性的求值结果会缓存起来,下次继续使用;如果计算属性方法依赖于任何未更改的数据,则不会重新计算。Computed属性可以作为函数或者对象来求值2.computed的原理是什么:学习中听到最多的一句话就是computed是一种特殊的getter方法。在代理功能中可以结合watcher实现缓存和集合依赖。1)计算属性是可缓存的。您如何知道计算属性的返回值已更改?这个其实是结合watcher的dirty属性来区分的。当dirty为true时,意味着需要重新计算。为false时,计算属性没有变化,不需要重新计算。直接读取缓存值即可。2)计算属性内容变化后模拟:计算属性的watcher和组件中的watcher都会收到通知,计算属性的watcher会将其dirty属性设置为true。下次读取计算属性时,会重新计算,因为dirty为true值componentwatcher得到通知,并执行render函数重新渲染。3、详细解释一下整个计算过程:使用watcher读取计算属性来读取计算属性函数中的数据。定义响应式时,get读取watcher.value计算属性和组件watcher同时观察数据变化。当数据发生变化时,计算属性和组件观察者都会收到通知。组件观察器将重新渲染组件。如果由于数据更改导致脏属性为真,计算属性观察器将重新计算计算属性的结果。5.面试题:watch和computed有什么区别?其实我觉得这两个的功能是完全不一样的,不知道为什么总拿来比较。手表是一种行为,状态改变后需要做什么。Computed是一种状态,也可以说是各种状态初始化的结果。我认为比较computed和filter更好?用于初始化状态。computed更适合大量数据计算的结果,重复使用,更新不频繁。因为有缓存,所以性能大大提高。filter适合数据量小的初始处理,计算量不宜太大,因为每次渲染都会计算,可以经常更新。