ES6基础----proxy的使用

发布于:2024-09-19 ⋅ 阅读:(15) ⋅ 点赞:(0)

目录

  Proxy 是代理的意思,主要用于拦截用户对对象的数据操作,是一个构造函数直接 new

    1、 Proxy 第一个参数是拦截的对象,第二个参数是拦截之后要做的操作

2、拦截对象的读取操作

3、拦截写入的操作    拦截的一个 key 不能写入修改

4、拦截删除的操作    拦截的一个 key 不能删除


  Proxy 是代理的意思,主要用于拦截用户对对象的数据操作,是一个构造函数直接 new

  let obj={

        name:"张三",

        age:20

    }  

    1、 Proxy 第一个参数是拦截的对象,第二个参数是拦截之后要做的操作


//                 拦截 , 操作(是一个对象)  

    let pro=new Proxy(obj, {

2、拦截对象的读取操作

//第一个参数是拦截的对象,第二个参数是拦截的 key 值        

//形参      拦截对象 key值

        get(obj,key){//---读取

            if(key=="age"){

                return obj.age>18?"成年":"未成年"   // :否则    ?返回      ---如果大于18返回成年,否则返回未成年

            }else{

                return obj[key]; //      返回 key 的值   因为是数组所以用 []  , 直接用 key 表示的是属性 name

            }

        },    //操作用 , 隔开


3、拦截写入的操作    拦截的一个 key 不能写入修改

set(obj,key,value){  //--设置其中一个 key 不能被删除  

            if(key=="name"){

                console.error("name不能修改")   //打印不能修改的错误

            }else{

                return obj[key]=value   //将值修改

            }

        },


4、拦截删除的操作    拦截的一个 key 不能删除

  deleteProperty(obj,key,value){

            if(key=="name"){

                console.error("name不能删除")   //打印不能删除的错误

            }else{

                return delete obj[key];   //返回被删的值

            }

        },

    });


    console.log(pro.name);//张三  用 pro,数组调用属性,在数组中

    console.log(pro.age);//成年


    pro.name="李四"//设置   ----设置之后并没有修改成功   name不能修改

    pro.age=15;//设置           ---设置成功

    console.log(pro.name);//张三  ----设置之后并没有修改原数组的属性值成功

    console.log(pro.age);//未成年



    console.log(delete pro.name);//删除 name   返回 flase

    console.log(delete pro.age);//删除 age    返回 true

    console.log(pro.name);//

    console.log(pro.age);//未成年


网站公告

今日签到

点亮在社区的每一天
去签到