关于javascript:搞懂Vue响应式原理1监听对象

源代码如下：

        //1、第一步 将数据列入跟踪 应用Object.defineProperty()        let defineReactive = function (data) {            if(!data || typeof data != 'object') return              Object.keys(data).forEach(key => {                    let value = data[key]                    defineReactive(value)  //如果value还是对象，则对该对象递归持续应用defineReactive办法，实现深度绑定                    Object.defineProperty(data, key, { //应用该办法监听对象属性的变动                        enumerable: true,                        configurable: true,                        get: function () {                            console.log(value,'get method')                            return value                        },                        set: function (newValue) {                            console.log(value,'set method')                            if (value === newValue) return                            value = newValue                        }                    })            })        }        let obj = {            a:3,            b:5,            c:{                c1:7            }        }        defineReactive(obj)        // console.log(obj.a);        console.log(obj.c.c1) //返回值为7，调用前输入7 "get method"        // obj.a = 30        obj.c.c1 = 70 // 输入7 "set method"        // console.log(obj.a);        console.log(obj.c.c1) //返回值为70，调用前输入70 "get method"

能够看到，在批改或者调用obj对象的属性时，相应操作曾经被监听到并输入提示信息。此时咱们曾经实现对该对象的监听，并应用递归，在其属性值仍是对象时持续深刻监听。外围是应用Object.defineProperty来监听对象属性的获取和批改。