计算属性computed

一个变量依赖多个变量进行处理时，推荐使用computed。

　　计算属性，会有缓存，依赖的变量变化在计算，否则直接返回缓存值

每一个计算属性都包含一个get和set函数，如果某一个属性是一个函数那么就是默认只读属性（get），如果是一个对象可以为该计算属性设置get和set方法

computed 里面的属性可以是函数（get）也可以是对象（set，get）

get什么时候调用？

　　1、初次读取某一个计算属性时（系统自动调用）

　　2、所依赖的数据发生变化时

set什么时候调用？

　　1、当计算属性被修改时

一般set拿到新值后 通知依赖值更改 从而达到从新计算

<h2 @click="changeFullName">{{fullName}}</h2>
data{
   firstName: '张',
   lastName: '三' 
} 
mtehods: {
    changeFullName() {
        fullName = '李 四'
    }
}
computed: {
    fullName: {

        set(newVal) {
            this.firstName = newVal.split(' ')[0];
            this.lastName = newVal.split(' ')[1];
          },

　　　　　　// get有什么作用？当有人读取fullName的时，get就会被调用（初次，不是初次则返回缓存的数据），且返回值就作为fullName的值

　　　　　get() {
　　　　　　　return this.firstName + this.lastName 
　　　　　} 
　　} 
｝ 

computed和methods的区别

　　效果上两个都是一样的，不同的是

computed是基于它的依赖缓存，只有相关依赖发生改变时才会重新取新值。

methods在从新渲染的时候，函数总是会从新调用执行。

计算属性总结：

　　1、定义：要用的属性不存在，要通过已有的属性计算得来

　　2、原理：底层借助Object.defineproperty方法提供的getter和setter。

　　3、get函数什么时候执行？

　　　　初次读取时执行一次

　　　　当依赖数的数据发生改变时会被再次调用

　　4、set函数什么时候执行？

　　　　当计算属性被修改时

　　5、优势：与methods相比，内部有缓存机制（复用），效率更高。

　　6、备注

　　　　计算属性最终会出现在vm上，直接读取使用即可。

　　　　如果计算属性要被修改，那么必须写set函数去响应修改，且要处理在计算时依赖的数据