1，这个问题经常在面试中被问到，所以我想总结一下。

2，如果你不深入理解它们，依然能写vue，但是看完这篇文章，我觉得可以做的更好。

3，这里只说重点区别，基本用法不解释，有哪些问题希望大家一起交流探讨。

computed和methods的区别，下面例子帮助理解。

var vm = new Vue({
  data: { a: 1, b:2},
  computed: {
    sums1: function () {
      return this.a +this.b
    }
  },
  methods: {
    sums2: function () {      
        return this.a +this.b
    }  
 }})
this.sums1//  =>2 可以写到模版里 {{sums1}}
this.sums2()//  =>3 可以写到js里

computed可缓存，依赖的多个值在未发生变化的时候不会触发再次计算，你可以直接用sums1，不会在执行这个函数计算。methods确要重复计算的。
computed响应式更新，依赖值的变化可以立即更新到dom展示，所以这里写异步处理无效，methods可以写异步操作计算，更新dom要等到当前的事件循环结束以后
所以现在你知道，他们都可以做计算值，但是大量的数据计算，不需要异步交互的，类似for循环计算写到computed避免重复计算影响性能。而异步的计算操作和简单的计算可以写到methods，

computed和watch的区别

watch 观察者，观察某个属性的变化而去做处理。这个观察通常是细致的深入的。可以观察嵌套对象，可以观察这个属性前后的变化，新旧值的比对。
computed关注的重点是计算结果，watch关注变化本身和过程，a+2，想知道加了几用watch，只想用a+2的结果用computed
watch多用于一对多，一个属性去做其他大量操作。computed多对一，多个值变化都会影响到我。

使用场景，单纯的大量计算写到computed，异步请求/事件处理/函数方法写到methods，想观察一个属性具体的变化写到watch。理解和写好这些，可以提升代码的性能，可以避免一些莫名其妙的bug