1.计算属性
在模板中绑定表达式很方便，但是只能是一些简单的操作 ，太过复杂的时候，就会显得笨重，不易于维护。例如: 看着很复杂。所以最好只有一个，就需要用到计算属性(computed)

<div id="example">
{{ message.split('').rescrese().join('') }}
</div>

基础例子：

<div id="example">
  <p>Original message: "{{ message }}"</p>
  <p>Computed reversed message: "{{ reversedMessage }}"</p>
</div>

var vm =new Vue ({
    el:'#example',
    data :{
    message:'hello'
    },
    //下面就是计算属性了，他把三个操作都定义在了一个函数里面
    //vm.reversedMessage 的值始终取决于 vm.message 的值
    computed:{
    reversedMessage:function(){
        return this.message.split('').reverse().join('')
    }   
    }
})

结果就是下面

Original message: "hello"
Computed reversed message: "olleh"

2.计算缓存 VS method方法

<p>Reversed message: "{{ reverseMessage() }}"</p>

methods: {
  reverseMessage: function () {
    return this.message.split('').reverse().join('')
  }
}

使用method方法我们同样能得到和计算属性一样的答案。但是这里有一个区别。
当我们使用计算属性时，message的值只要没改变，不管访问多少次的reversedMessage,得到的值永远是之前计算的结果，
因为计算属性有缓存，类似于有一个记录。而method会一直调用执行函数，所以就不会有缓存。

3.计算属性 VS Watched Property

<div id="demo">{{ fullName }}</div>

var vm = new Vue({
  el: '#demo',
  data: {
    firstName: 'Foo',
    lastName: 'Bar',
    fullName: 'Foo Bar'
  },
  watch: {
    firstName: function (val) {
      this.fullName = val + ' ' + this.lastName
    },
    lastName: function (val) {
      this.fullName = this.firstName + ' ' + val
    }
  }
})

var vm = new Vue({
  el: '#demo',
  data: {
    firstName: 'Foo',
    lastName: 'Bar'
  },
  computed: {
    fullName: function () {
      return this.firstName + ' ' + this.lastName
    }
  }
})

4.计算setter 计算属性默认只有getter。当然你也可以提供一个setter 想理解先明白
类方法：使用static修饰，属于整个类的，不是属于某个实例的，只能处理static域或调用static方法；类方法是属于整个类的，而实例方法是属于类的某个对象的
实例方法：属于对象的方法，由对象来调用。实例方法也叫做对象方法。
getter 是一种获得属性值的方法，setter是一种设置属性值的方法。

computed:{
 fullname:{
 get: function(){
 return this.firstname + '' + this.lastname
 },
 set: function (newvalue){
   var names = newvalue.split('')
   this.firstname = names[0]
   this.lastname = names[names.length - 1]
 }
 }
}

现在在运行 vm.fullName = 'John Doe' 时， setter 会被调用， vm.firstName 和 vm.lastName 也会被对应更新。 5.观察watchers

虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的 watcher 。这是为什么 Vue 提供一个更通用的方法通过 watch 选项，来响应数据的变化。当你想要在数据变化响应时，执行异步操作或开销较大的操作，这是很有用的。

不懂