计算属性（computed）

1. 计算属性是基于它们的响应式依赖进行缓存的，如果依赖没变则不会重新执行，而 是直接返回缓存的内容
2. 计算属性默认只有 getter，不过在需要时你也可以提供一个 setter

var vm = new Vue({
  el: '#example',
  data: {
    message: 'Hello'
  },
  computed: {
    // 计算属性的 getter
    reversedMessage: function () {
      // `this` 指向 vm 实例
      return this.message.split('').reverse().join('')
    }
  }
})

reversedMessage 中依赖message属性，message属性变化时reversedMessage会重新执行，否则会返回之前的缓存内容

// ...
computed: {
  fullName: {
    // getter
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    // setter
    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 也会相应地被更新。

方法 (method)

方法每次调用都会重新执行，不会有缓存

侦听属性（watch）

侦听属性在于可以自行监听单个或多个属性，在这些属性值发生变化时执行对应内容

例：

data: {
    question: '',
    answer: 'I cannot give you an answer until you ask a question!'
  },
  watch: {
    // 如果 `question` 发生改变，这个函数就会运行
    question: function (newQuestion, oldQuestion) {
      this.answer = 'Waiting for you to stop typing...'
      this.debouncedGetAnswer()
    }