什么是计算属性？Vue中如何区分方法和计算属性以及观察者何时使用？
计算属性：
定义：要用的属性不存在，要通过已有的属性计算得来
原理：底层借助了Object.defineproperty方法提供的getter和setter
在用计算属性的时候getter函数什么时候会执行？
1.在初次读取的时候会执行一次
2.当依赖的数据发生改变的时候会被再次调用
setter什么时候使用？
如果计算属性要被修改 那必须写set函数去响应修改，且set中要引起计算时依赖的数据发生改变
如何使用计算属性？
计算属性与data等属性一样 直接挂载于Vm实例对象上，直接读取即可
计算属性的优点？
methods中的方法每使用一次方法就会被调用一次，不管里面的数据是否发生变化Vue都会将模板重新解析一遍。而使用计算属性时，因为其内部有缓存机制，所以只要里面影响结果的变量没有发生变化，无论计算属性被使用多少次，函数都只会被调用一次，所以相对于methods来说计算属性效率更高，调试起来更为方便，
Vue中何时使用计算属性？何时使用方法？何时使用观察者？
methods 方法
在我们使用 Vue 时可能会有很多方法会被放到这里，比如它可能是我们的事件处理方法，一些操作方法的逻辑等等，但是它不能跟踪任何依赖，而且还会在每次组件重新加载时都会执行，这就会导致我们的方法会执行很多次，如果我们的 UI 操作频繁的话，会导致性能的问题，所以在一些开销比较大的计算时，我们应该尝试其他方案进行优化处理。
computed 计算属性
从名字我们其实大概的可以看出，它是一个依赖于其他属性的，当依赖的属性发生变化的时候就会触发我们计算属性的逻辑，而且是基于它们依赖的属性进行缓存的，也就是说只有当依赖的属性发生变化的时候才会从新求值。
相比 methods 的优势在于不必每次从新执行定义的函数，这给我们的性能上有着很大的优势，对我们已经存在的数据属性非常好的处理方式，例如我们案例中 fullName 的计算，优势非常明显。
watcher 观察者
当一些数据属性变化时，我们执行一些逻辑时观察者对我们非常重要，它可以帮助我们监听属性的变化，只要属性发生变化，我们就可以执行对应的一些操作。
简单来说，就是需要相加，相减，相乘，除，数据映射的时候，或者你不想手动调用函数的时候，你就可以用到，不需要你自己手动操作，他自己帮你执行。
例如：需要计算一个表格的总和，如果使用方法时，需要写一个计算总和的函数，然后每次调用，但如果使用计算属性时，表格数据一变化，他自己就自动变化了，不需要你手动动用。
可以理解为它就是一个变量。只不过是通过计算得到的变量，它和函数不一样，函数中可能会有很多操作，比如说请求接口，打开弹窗，等等，但是计算属性，就单纯的是为了制造一个变量提供给你使用而已。
以上是 什么是计算属性？Vue中如何区分方法和计算属性以及观察者何时使用？ 的全部内容， 来源链接： utcz.com/z/376092.html
