計(jì)算屬性（二）
模板中綁定的數(shù)據(jù)依賴于data中的數(shù)據(jù)越驻，data中的數(shù)據(jù)更新會(huì)時(shí)模板相應(yīng)更新倘待。
計(jì)算屬性緩存 vs 方法
這小節(jié)說的是計(jì)算屬性與methods的區(qū)別罪裹，文檔開頭說了methods同樣可以完成計(jì)算的效果宾肺，兩種方法最終可以完成的結(jié)果時(shí)相同的塑崖。
不同點(diǎn)：vue的特點(diǎn)之一是復(fù)用性文黎，使得小路提高惹苗，methods的方法每一次觸發(fā)都有需要重新計(jì)算、渲染耸峭，而計(jì)算屬性只有在依賴的數(shù)據(jù)發(fā)生更新時(shí)才會(huì)再次計(jì)算桩蓉，否則會(huì)緩存，這樣做大大的提高了效率劳闹，依賴的數(shù)據(jù)必須在data中才能是響應(yīng)式的院究。
但是有時(shí)候洽瞬，當(dāng)我們不需要緩存時(shí)，可以使用方法替代业汰。
計(jì)算屬性 vs 偵聽屬性
說的是watch, watch可以監(jiān)聽數(shù)據(jù)變化伙窃，并在數(shù)據(jù)變化的時(shí)候“做一點(diǎn)其他的事情”
原文中給出了這算代碼：
<div id="demo">{{ fullName }}</div>
使用watch的方法:
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
}
}
})
使用計(jì)算屬性的方法：
var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar'
},
computed: {
fullName: function () {
return this.firstName + ' ' + this.lastName
}
}
})
文檔中指出，使用watch的代碼片段是重復(fù)的样漆。使用計(jì)算屬性的代碼并沒有重復(fù)为障，是更好的。并建議我們不要濫用watch放祟。
我的理解是：watch 的作用主要是監(jiān)聽數(shù)據(jù)變化鳍怨，在數(shù)據(jù)變化是做一點(diǎn)“其他的事情”，而非像上面代碼一樣對(duì)數(shù)據(jù)進(jìn)行再加工跪妥，對(duì)數(shù)據(jù)進(jìn)行再加工應(yīng)該交給更專業(yè)的計(jì)算屬性來完成鞋喇。
