JavaScript 进阶 31 -- 简单来说下vue.js 数据监测observe的实现的原理

这篇文章是接上一篇继续来总结一下关于数据监测 observer 实现响应式的原理。

响应式的原理：

只要要数据发生改变，页面视图就发生变化

简单来说 就是一个方法，里面使用for in循环，分别为对象属性添加 get() 和 set() 方法，来实现对数据监测，这就要用到上一篇文章中提到的 defineProperty 对象自定义属性

直接看段代码：

let obj ={
    name:'tom',
    age:22,
    company:{
        address:'北京'
    }
};
obj.name = 'lily'

如果想实现在改变数据的同时，页面视图或者用到次数据的地方也能够做出相应，所以就要对这个数据做观察，就需要重新定义属性，使用 defineProperty（）方法

let obj ={
    name:'tom',
    age:22,
    company:{
        address:'北京'
    }
};
//观察数据
function observe(obj){
    for(let key in obj){
        let val = obj[key];//将原有的值先存到第三方变量中
        Object.definePropert