Vue data定義為函數的原因？

var Vue = function () {};

Vue.prototype.data = {a: 1, b: 2};

var f1 = new Vue();

var f2 = new Vue();

f1.a = 3;

console.log(f2.a) ; // 3
　

首先看下上面這段代碼，這是一種對象添加屬性的方式。

在函數或者類class上進行屬性值擴展時，如果使用原型上直接擴展的方式，對象實例化時無法區分不同對象之間的值作用域，用對象的方式初始化data並不合適。

var Vue = function () {

  this.data = this.datas();

};

Vue.prototype.datas = function () {

  return {

    c: 1,

    d: 2

 }

}

var v1 = new Vue();

var v2 = new Vue();

v1.c = 5;

console.log(v2.c);  // 1

　　在函數內聲明實例屬性報存data，每個實例對象的data都是經過一次函數執行得到有不同的返回結果，所以返回data的值具有自己獨立的作用域。

* 在定義Vue實例時，給Vue傳參是一個對象，對象中data就是一個函數，Vue在實例化的時候會調用這個函數每個實例都會返回新的值，data得到不同的值作用域。

另外，賦值函數不一定要定義在原型上，也可以定義為函數或類的實例方法。