1.底层原理：数据的劫持，通过ES6中的defindproperty方法实现：
// var obj = {};
// Object.defineProperty(obj, 'name', {
// get: function() {
// console.log('我被获取了')
// return val;
// },
// set: function (newVal) {
// console.log('我被设置了')
// }
// })
// obj.name = 'fei';//在给obj设置name属性的时候，触发了set这个方法
// var val = obj.name;//在得到obj的name属性，会触发get方法
上边已经实现了简单的数据绑定，如果把它与表单框结合起来并添加一个监听器的情况下：
var obj = {};
var demo = document.querySelector('#demo')
var inp = document.querySelector('#inp')
Object.defineProperty(obj, 'name', {
get: function() {
// console.log('获取')
return val;
},
set: function (newVal) {//当该属性被赋值的时候触发
// inp.value = newVal;
demo.innerHTML = newVal;
}
})
inp.addEventListener('input', function(e) {
// 给obj的name属性赋值，进而触发该属性的set方法
obj.name = e.target.value;
});
// obj.name = '';//在给obj设置name属性的时候，触发了set这个方法
// var val = obj.name
当inp的value值发生改变时demo的innerHTML也会随之发生改变，这样就实现了简单的数据双向绑定
Vue数据的劫持结合发布者-订阅者模式实现数据的双向绑定：
（1）、通过observer（即objectdefindproperty的set）循环递归对所有数据对象进行监听，这样的话给每个对象赋值就会触发setter，那么就能监听到数据的变化，
（2）、实现一个指令解析器compile,对每个dom节点的指令进行扫描解析，根据指令模板替换数据，绑定相应的更新函数，
（3）、实现一个Watcher（即订阅者，即每个指令绑定的属性），作为连接Observer和Compile的桥梁，能够订阅并收到每个属性变动的通知，执行指令绑定的相应回调函数，从而更新视图
小弟不才，对于发布者、订阅者模式认知较浅，欢迎大佬指教...
