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)
相关推荐
neter.asia4 分钟前
vue中如何关闭eslint检测?
前端·javascript·vue.js
~甲壳虫5 分钟前
说说webpack中常见的Plugin?解决了什么问题?
前端·webpack·node.js
十一吖i22 分钟前
前端将后端返回的文件下载到本地
vue.js·elementplus
光影少年24 分钟前
vue2与vue3的全局通信插件,如何实现自定义的插件
前端·javascript·vue.js
As977_25 分钟前
前端学习Day12 CSS盒子的定位(相对定位篇“附练习”)
前端·css·学习
susu108301891127 分钟前
vue3 css的样式如果background没有,如何覆盖有background的样式
前端·css
Ocean☾28 分钟前
前端基础-html-注册界面
前端·算法·html
Rattenking28 分钟前
React 源码学习01 ---- React.Children.map 的实现与应用
javascript·学习·react.js
Dragon Wu30 分钟前
前端 Canvas 绘画 总结
前端
CodeToGym35 分钟前
Webpack性能优化指南:从构建到部署的全方位策略
前端·webpack·性能优化