vue的内部使用Oject.defineProperty()来实现数据响应式。
vue.js 则是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。
vue通过遍历传入data选项的所有对象属性,并使用defineProperty把这些property全部转换成getter/setter。getter是获取某个特定属性的值的方法。setter是设定某个属性值的方法。
getter/setter对用户来说是不可见的。
每个组件实例都对应一个watcher实例,它会在组件渲染过程中把接触过的数据属性记录为依赖,进行依赖收集,当依赖的setter触发时,会通知watcher,触发关联组件的重渲染。
图片说明

Object.defineProperty的缺陷
利用下标方式修改数组数据或者给对象添加新数据不会被添加到vue的响应式监管中,因为Object.defineProperty不会拦截到这些操作。因此vue提供了一个API解决。
vue.set
https://cn.vuejs.org/v2/guide/reactivity.html