什么是响应式，响应式顾名思义就是你数据发生改变了，那我视图也要做出相对应的改变，在vue中 对象的响应式核心就在于ES5 中的 Object.defineproperty 进行监听，通过访问器修改数据并调用视图修改。
在vue源码实现中，主要分为5步来完成对象响应:
第一步初始化数据，通过initData来初始化用户传入的数据，
第二步就是进行数据的观测，调用Observe（data）方法传递数据，
第三步通过this.walk进行观测对象，把传入的对象进行循环遍历，
第四步通过defineReactive函数来循环对象属性定义响应式变化，
第五步使用Object.defineproperty进行重新定义数据
下面咱们就模拟一下对象响应式原理实现：下方附代码及图片
let data = { name: "我是谁", obj: { age: 18, sex: '男' } }
Observe(data)
function Observe(data) {
if (!data || typeof data !== 'object') {
return new Error("不是对象不可以进")
}
walk(data);
}
function walk(obj) {
Object.keys(obj).forEach(key => {
defineReactive(obj, key, obj[key])
})
}
function defineReactive(data, key, value) {
Observe(value);
Object.defineProperty(data, key, {
enumerable: true, //可枚举（可以遍历）
configurable: true, //可配置（比如可以删除）
get: function Getter() {
console.log('get', value)
return value
},
set: function Setter(newVal) {
Observe(newVal)
if (newVal !== value) {
console.log('set', newVal)
value = newVal
render()
}
}
})
}
data.obj={ age:20, sex:'女' }
function render(){ console.log("通知视图更新了"); }
以上就是本人对Vue对象响应式原理的理解及认知，源码的大体流程也差不多是这样的，感兴趣的小伙伴可以去看一看源码， 还有那句话：如有不对之处及不周之处请大佬们指出，也希望对一些人有所帮助，咱们下次再会！
