vue 双向绑定的原理：数据劫持结合发布者-订阅者模式
举例说明：
在vue中创建数据对象
var vm = new Vue({
data: {
obj: {
test: 1
}
},
created: function () {
console.log(this.obj);
}
});
结果：
Object {
test: 1
_ob_: Observer
get test: function reactiveGetter()
set test: function reactiveSetter(newVal)
_proto_: Object
}
我们会发现其中多了些东西比如说get和set，那么他们是what？
vue通过object.defineProperty这个函数来进行数据劫持，这个函数可以控制一个对象的一些属性，读写啊之类的
例如
let Obj = {};
let pro = '';
Object.defineProperty(Obj, 'pro', {
set(value) {
pro = value
console.log('变量值设定为‘ + value)
}，
get(value) {
return ’获取到的变量值为：‘ + pro
}
})
Obj.pro = 'vue'; // 变量值设定为vue
console.log(Obj.pro); //获取到的变量值为vue
在设置Obj.pro的值时会触发set函数，在读取Obj.pro的值时会触发get函数
双向绑定：视图变化时更新数据，可以使用事件监听，比如input事件啊，click事件啊等
数据变化时更新视图，使用Object.defineProperty中定义的set函数，数据变化时执行set函数，在数据双向绑定时先对数据进行劫持监听，所以有一个Observe监听器，监听 数据的所有属性，属性变化时告诉订阅者Watcher看是否需要更新，因为订阅者是多个，所以需要消息订阅器Dep来收集订阅者，然后在监听器Observer和订阅者Watcher之间进 行统一管理，接着，我们还需要有一个指令解析器Compile，对每个节点元素进行扫描和解析，将相关指令对应初始化成一个订阅者Watcher，并替换模板数据或者绑定相应的函 数，此时当订阅者Watcher接收到相应属性的变化，就会执行对应的更新函数，从而更新视图。因此接下去我们执行以下3个步骤，实现数据的双向绑定
1.实现一个监听器Observer，用来劫持并监听所有属性，如果有变动的，就通知订阅者。
2.实现一个订阅者Watcher，可以收到属性的变化通知并执行相应的函数，从而更新视图。
3.实现一个解析器Compile，可以扫描和解析每个节点的相关指令，并根据初始化模板数据以及初始化相应的订阅器