美文网首页
Proxy代理对象

Proxy代理对象

作者: 此人已失联好几天 | 来源:发表于2020-04-22 16:36 被阅读0次

    Proxy 对象为ES6的新代理对象,及其类似于ES5中的Object.defineProperty的对象劫持,但是又区别于Object.defineProperty
    在MDN中是这样描述Proxy的

    Proxy 对象用于定义基本操作的自定义行为(如属性查找、赋值、枚举、函数调用等)。

    本文中出现的Reflect对象在本文中不会着重介绍,如果感兴趣的童鞋可以移步小进进不将就ES6之Reflect介绍,建议瞅一眼,挺好用的一个对象
            // 数据对象
            let obj = {
                name: '张三',
                age: 28,
                sex: 'male',
                grade: '三年级',
                father: '张大炮'
            };
    
            // 实例 
            let proxy = new Proxy(obj, {
                /*
                 * target === obj
                 * key === key
                 * value === value
                 * receiver === proxy变量
                 * */
                // 当获取proxy身上的数据时会触发 get 方法
                get(target, key, receiver) {
                    // Reflect 在未来有可能会替代 Object 对象
                    // Reflect.get方法会在映射对象身上找该属性,当数据源身上有该属性时返回true,没有则返回false
                    let res = Reflect.get(target, key, receiver);
                    if(!res) {
                        throw `get ${ key } error`;
                    }
                    console.log('获取');
                    return res;
                },
                set(target, key, value, receiver) {
                    // Reflect.set方法会在映射对象身上找该属性,并赋值,如果赋值成功或者在对象上增加属性并赋值则返回true,赋值失败则返回false(如:Object.defineProperty中把对象属性设置writable:false时)
                    let res = Reflect.set(target, key, value, receiver);
                    if(!res) {
                        throw `set ${ key } error`;
                    }
                    console.log('设置');
                    return res;
                },
                deleteProperty(target, key) {
                    // Reflect.deleteProperty方法会在映射对象身上找该属性,并删除该属性,删除成功返回true,删除失败则返回false(如:Object.defineProperty中把对象属性设置configurable:false时)
                    let res = Reflect.deleteProperty(target, key);
                    if(!res) {
                        throw `delete ${ key } error`;
                    }
                    console.log('删除');
                    return res;
                }
            });
    
            console.log(proxy.name);
            proxy.name = '李四';
            delete proxy.father
            proxy['lastName'] = 'Xu';
            console.log(proxy);
            console.log(obj);
    
    console

    相关文章

      网友评论

          本文标题:Proxy代理对象

          本文链接:https://www.haomeiwen.com/subject/kzgiihtx.html