Vue中methods computed 和 watch 的區別

methods ：執行屢次調用的時候 ，當數據沒有發生變化，計算屬性裏面的函數只須要執行一次，而methods調用幾回，就執行幾回，哪一個性能更高？vue內部是對計算屬性作了一層緩存的，它會觀察數據有沒有發生變化，若是沒有變化的話，會吧原來的結果直接返回出去，而不是從新計算下，若是你不但願有緩存，請用方法代替

computed: 依賴追蹤機制爲基礎 根據a的值變化 計算出新的值 默認是以get 方法 必需要有return 並且不支持異步 ，基於它們的依賴進行緩存，只有它的相關依賴改變時纔會從新求值，爲何須要緩存？假設咱們有一個性能開銷比較大的計算屬性A，它須要遍歷一個巨大的數組並作大量的計算，而後咱們可能有其餘的屬性依賴與A，若是沒有緩存，咱們將不可避免地屢次執行A的getter,多個數據影響一個數據(狐朋狗友帶壞你)。某【一些】變量發生變化時，影響的【單個】結果對應地發生改變。計算屬性通常沒有set方法，只讀屬性。

watched: 依賴追蹤機制爲基礎 觀察a的值變化 當a的值變化時，幹一件事 ，也叫觀察者、偵聽器，屬性名要和被觀察的值的名字一致 a(newVal,oldVal){ },只有值變化的時候纔會觸發變化，支持數據變化時執行異步，有關計算的事watch作起來比較麻煩，用computed作計算比較簡單，監聽的對象個數：watch只對一個對象進行監聽，computed對多個對象進行監聽(若是有兩個對象其中任意一個作變化，且無論其中哪一個對象變化都是作相同的動做的時候應該怎麼辦呢，把這兩個對象寫在一個對象裏面，再watch這個對象，多個watch之間應該儘可能避免數據耦合)，在某些狀況下，確實須要跟蹤觀察值的變化，確實要知道變化前的值和變化後的值，那麼就須要使用watch。好比我如今子組件中，須要實現這樣一個功能，若是props中的某個對象發生了變化，那麼就觸發對應的methods。那麼這個時候你須要用什麼方法來觸發對應的methods呢，這裏很顯然須要使用watch。當你想要在數據變化響應時，執行異步操做或開銷較大的操做，選擇使用watch,一個數據影響多個數據（一粒老鼠屎糟蹋一鍋粥）。適合監控場景，某【一個】變量改變時須要作什麼操做；相似於onchange，適合耗時操做，如網絡請求等。因此每一個方法的存在，都是根據業務場景來的。