如何使用Proxy与Reflect实现简单的双向数据绑定

即数据双向绑定，即当数据发生变化的时候，视图也就发生变化，当视图发生变化的时候，数据也会跟着同步变化。 

1. 获取dom对象
2. 设置代理对象
3. 配置代理选项
4. 添加事件
5. 实现双向数据绑定

{
    // 获取dom元素
    const txt = document.getElementById('txt')//span
    const inp = document.querySelector('#inp');//input
    // 初始化代理对象
    const obj = {}
    // 代理选项
    const handle = {
        get(target, key) {
            console.log('get');
            return Reflect.get(target, key)
        },
        set(target, key, value) {
            ////修改一下前端页面，让input标签里的值事实变化，把span标签也修改一下
            if (key === 'text') {
                inp.value = inp.value === value ? inp.value : value
                txt.innerHTML = value
            }
            //更新OBJ
            //前端页面改了，对象也要修改
            return Reflect.set(target, key, value)
        }
    }
    //创建具体的代理
    let objProxy = new Proxy(obj, handle)
    //监听input的状态
    inp.addEventListener('keyup', function (e) {
        objProxy.text = e.target.value//e.target相当于input
        console.log(obj);
    })
    objProxy.text = 1234567890
}