(精华)2020年7月5日 JavaScript高级篇 ES6(Proxy)

// let p = new Proxy(target,handel)
// tearget: 用Proxy包装的目标对象
// handel:一个对象proxy代理操作的对象
// ----------get用于对象属性读取的拦截 可以接收三个参数 目标对象 属性名 proxy实例本身(可选)------------------
// 判断一个对象的属性是否存在
let person = {
    name: 'tony'
}
let proxy = new Proxy(person, {
    get: function (target, property) {
        // console.log(target)
        // console.log(property)
        return target[property]
    }
})
console.log(proxy.name);
// ------------set 拦截对象赋值的操作 目标对象 属性名 属性值 proxy实例本身-------------
// 对对象赋值的年龄进行一个判断
let obj = {}
let setVid = {
    set: function (object, prop, value) {
        Reflect.set(object, prop, value)
    }
}
let p = new Proxy(obj, setVid)
p.age = 200
console.log(p.age);
//------------案例----------------
let handel = {
    get(target,key){
        console.log(key);
        if(key[0] === "_"){
            throw new Error('内部属性禁止外部访问')
        }
        return target[key]
    },
    set(target,key,value){
        target[key] = value
        // return true
    }
}
// 提示_属性是 内部属性禁止外部访问
let target = {}
let proxy = new Proxy(target,handel)
// --------------proxy设置删除操作 ------------------
let person = {name:'张三'}
let handel  = {
    deleteProperty(target,key){
       console.log('不允许删除属性');
       // 这里面删除才是真正可以删除
       delete target[key]
    }
}
let proxy = new Proxy(person,handel)
delete proxy.name
console.log(proxy.name);
// ----------------apply拦截 的是函数的调用-------------------
let target = function(){return '我是目标函数'}
let handel = {
    apply:function(){
        return '我是拦截你的'
    }
}
let p = new Proxy(target,handel)
console.log(p());
//--------------------has 拦截 是否有某个属性的 -----------------------
// has是否可以拦截原型上面的属性呢
// 可以隐藏我们的属性
let father = {
    name:'father'
}
let handel = {
    has(target,key){
        if(key[0] === '_'){
            return false;
        }
        return key in target
    }
}
let target = {_prop:'a',prop:'b'}
target.__proto__ = father
let proxy = new Proxy(target,handel)
console.log('_prop' in proxy);
console.log('name' in proxy);
// ------------------------------construct-----------------------------------
function Person(name){
    this.name = name
}
let person = new Person('tony')
let proxy = new Proxy(Person,{
    construct:function(target,key){
        return {name:'Chris'}
        // return 123
        // 返回的一定要是一个对象
    }
})
console.log(new proxy('张三').name);
  • 3
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

愚公搬代码

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值