Reflect的作用,target,property,value,receiver代表啥

1.真的proxy

复制代码
let target ={name:'张三'}
let handler = {
  get(target,property,receiver){
    console.log(1,target,2,property,3,receiver)
    return Reflect.get(target,property,receiver)
  },
  set(target,property,value,receiver){
    console.log('a',target,'b',property,'c',value,'d',receiver)
    return Reflect.set(target,property,value,receiver)
  }
}
let proxy = new Proxy(target,handler)
console.log(proxy.name)
proxy.name = '李四'
// console.log(proxy.name)

以上代码用浏览器控制台运行下如下

可知target,property,value,receiver的值

不知道为啥这里的target换成多层的对象就不起作用了

复制代码
let target ={name:'张三',info:{age:18,sex:'男'}}
console.log(proxy.info.sex)
proxy.info.sex = '女'

2.自己写的proxy

很明显这里的reflect.get被return target[key]替代,

reflect.set被 '=' 替代

说明了reflect在proxy的作用

复制代码
let handler = {
  get(target, key, receiver) {
    console.log(1, target, 2, key, 3, receiver)
    return target[key];
  },
  set(target, key, value, receiver) {
    console.log('a', target, 'b', key, 'c', value, 'd', receiver)
    target[key] = value;
    return true;
  },
};
let target ={name:'张三'}
let proxy = new Proxy(target, handler);
console.log(proxy.name)
proxy.name = '李四'
console.log(proxy.name)
相关推荐
归于尽4 分钟前
useEffect玩转React Hooks生命周期
前端·react.js
G等你下课6 分钟前
React useEffect 详解与运用
前端·react.js
我想说一句7 分钟前
当饼干遇上代码:一场HTTP与Cookie的奇幻漂流 🍪🌊
前端·javascript
funnycoffee1237 分钟前
Huawei 6730 Switch software upgrade example版本升级
java·前端·华为
小鱼小鱼干10 分钟前
【Tauri】Tauri中Channel的使用
前端
拾光拾趣录12 分钟前
CSS全面指南:从基础布局到高级技巧与实践
前端·css
markyankee10114 分钟前
使用 Vue 脚手架创建项目的完整指南
vue.js
南屿im15 分钟前
基于 Promise 封装 Ajax 请求:从 XMLHttpRequest 到现代化异步处理
前端·javascript
青松学前端15 分钟前
vue-2.7源码解读之初始化流程和响应式实现
前端·vue.js·前端框架
杨进军16 分钟前
前端线上问题的那些事儿
前端·javascript·前端框架