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用到的也挺简单， 待梳理