vue運行機制總結

new Vue()運行以後，Vue調用_init函數進行初始化，初始化生命週期，事件，props,methods,data,computed,watch等

其中最重要的是經過Object.defineProperty設置setter和getter函數，用來 實現響應式(數據自動更新)和依賴收集 

初始化後，調用 $mount掛載組件

--------------

添加響應式數據：

this.$set(this.obj,'name','dongfang')  //由於是在初始化時就劫持監聽數據，因此初始化後添加的數據要響應式，必須經過$set方法添加數據監聽

數組變異方法：vue文檔連接

當直接修改數組某一項值時，vue無法檢測到，如

vm.items[1] = 'x' // 不是響應性的
vm.items.length = 2 // 不是響應性的

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)
// Array.prototype.splice 
vm.items.splice(indexOfItem, 1, newValue)

vue對以下數組方法進行了包裝變異，調用這些方法操做後 同樣能觸發視圖更新 。

• push()
• pop()
• shift()
• unshift()
• splice()
• sort()
• reverse()

-----------------

Object.defineProperty 和 Proxy

在使用Object.defineProperty時，咱們必須循環遍歷全部的域值才能劫持每個屬性並收集，這也是性能提升的一個瓶頸，固然這是因爲瀏覽器所限，

而Proxy的劫持手段則是官宣標準——直接監聽data的全部域值。

//data is our source object being observed
const observer = new Proxy(data, {
    get(obj, prop) { ... },
    set(obj, prop, newVal) { ... },
    deleteProperty() {
        //invoked when property from source data object is deleted
    }
})

---------------

vuex，vue-router用到的也挺簡單， 待梳理