每日三道前端面试题--vue 第四弹

什么是vue的计算属性?

官方定义:

计算属性，就是当其依赖属性的值发生变化时，这个属性的值会自动更新，与之相关的 DOM 部分也会同步自动更新。

计算属性实际上是一个方法，它可以完成各种复杂的逻辑，包括运算、函数调用等，并最终返回一个值。之前的章节中介绍了模版插值的语法，我们知道模板内的可以使用表达式进行计算，例如：{ { count * number }}。但有时候我们的计算逻辑并非如此简单，当模板中放入太多的复杂逻辑会让模板过于繁琐且难以维护。计算属性 computed 的使用可以解决此类问题。 computed 在项目中会大量使用，在使用时需要注意的是 computed 必须有一个返回值。使用 computed 并不难，难点在于如何编写其内部的复杂逻辑。

计算属性和侦听属性有什么区别？怎样选择?

两者之间的对比

• watch:监测的是属性值,只要属性值发生变化,其都会触发执行回调函数来执行一系列操作;
• computed:监测的是依赖值,依赖值不变的情况下其会直接读取缓存进行复用,变化的情况下才会重新计算

两者之间的区别

• 计算属性不能执行异步任务，计算属性必须同步执行。也就是说计算属性不能向服务器请求或者执行异步任务。如果遇到异步任务，就交给侦听属性。Watch也可以检测computed属性。

两者之间怎样选择

• computed能做的，watch都能做，反之则不行
• 能用computed的尽量用computed