浅谈vue的双向数据绑定

各位朋友好，在一些面试场景，尤其是大厂面试vue的时候，经常提及到一个非常重要的概念，叫做双向数据绑定。大家其实对于这个问题不会很陌生，vue中采用mvvm的模式，内置vm将view层与model层两者进行关联，任何一方的变化都会让另外一方受到影响。那回答完后，面试官还会继续追问，请回答一下你理解的双向数据绑定背后的原理是什么？那今天我们就一起探讨一下vue的背后的一些方式实现。

通过查阅一些其他资料，包括尤大大博客的对于实现双向数据绑定做了一定的解释。
所谓要实现双向数据绑定，vue中内部采用了发布-订阅模式。内部结合了Object.defineProperty这个ES5的新特性（ie8浏览器可不支持哦…），对vue传入的数据进行了相应的数据拦截，为其动态添加get与set方法。当数据变化的时候，就会触发对应的set方法，当set方法触发完成的时候，内部会进一步触发watcher,当数据改变了，接着进行虚拟dom对比，执行render,后续视图更新操作完毕。
来，直接上图看一下

好，分析完原理后，我们来看下es5这个方法Object.defineProperty有什么用呢？
上代码运行一下：

<div>
    <input id='input'/>
    <p id="content"></p>
</div>
let object = {}
Object.defin