双向数据绑定原理

• 1.首先会在一个函数内通过typeof去判断传进来的是不是一个对象，如果不是的话先通过object.keys转一下然后去遍历，拿到key
• 2.然后在定义一个处理函数，传三个值，一个拦截的目标对象，一个key，一个value（原值，因为获取的时候要返回原值，就是在get中），通过object.defineProperty,他也接收三个参数，一个目标对象，一个key，一个对象，对象中有set和get两个函数，get是获取，set是设置，set接收一个传过来的新值，就是修改后的值，然后去判断新的值和原来的值是不是相等，如果不相等，把新值去赋值给原值，get函数的haul，就是直接return原值就可以了，因为他是一个获取嘛。
• 3. 然后在第一个定义的函数中，在遍历中取调用一下。
• 4.当用更深层次的对象的时候，就是说对象里面还有对象，那么我们就在处理函数中把第一个函数调用一次，然后把value值传进去，这样进行一个递归的调用。

vue (defineProperty)实现拦截

• 进行数据劫持
• ++Object.defineProperty++ 拦截

<script>
    function observer (data) {
    //判断如果没有传值，或者传的值不是一个对象，就直接return
        if(!data || typeof data !== 'object') {
            return;
        }
        Object.keys(data).forEach(item => {
        observerProperty (data, item, data[item])
        })
    }
    
    function observerProperty (target, key, value) {
       observer (value)
        Object.defineProperty(target, key, {
            get () {
                return value;
            }
            set (val) {
                value = val
            }
        }
    }
    //这样就会对obj进行一个劫持，一旦改变obj内的属性，就返回相对应的数据，比如对obj的name进行了改变，observer()函数可能会返回一句obj的name已经改变为...
    //observer (obj)
    let obj = {
        id:1,
        name:zhngsan,
        age: 20
    }
</script>