JavaScript 进阶 32 - Proxy 代理

最新推荐文章于 2024-04-15 09:12:52 发布

淡泊-宁静致远

最新推荐文章于 2024-04-15 09:12:52 发布

阅读量324

点赞数 1

分类专栏： JavaScript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/dingdinglaila/article/details/111920649

版权

本文详细介绍了JavaScript中的Proxy构造函数，用于创建对象的代理，从而进行访问控制和增强Object的基本操作。通过示例展示了如何使用Proxy进行属性赋值、数据更新的监测，包括对数组操作的处理。同时对比了Proxy与Object.defineProperty()的区别，强调了Proxy在数据监测和性能上的优势，但注意其兼容性问题。

摘要由CSDN通过智能技术生成

Proxy();代理，

代理是指：用于描述某人或某事代表他人行事

在ES6中, Proxy() 代理的是 object。来进行访问控制和增加功能、修改Object的基本操作。基本操作：比如属性的调用、给属性赋值、删除属性、方法调用等等。

Proxy();可以理解成：创建一个对象的代理。可以对JavaScript中的对象的基本操作进行自定义。然后用自定义的操作 去覆盖其对象的基本操作。换句话说，就是一个对象去执行某个基本操作时, 其执行的过程和结果都是自己自定义的。

基础语法：

let proxy = new Proxy(obj,{
    get(target,key){
        return target[key];
    },
    set(target,key,value){
        target[key] = value
    }
})

Proxy是个构造函数，接收两个参数：

第一个参数 target：目标对象，即给哪个对象做代理，
第二个参数：配置对象； get()和set()方法接收的参数如下：
- target：目标对象
- key：给什么属性
- key：给什么属性
- value：设置什么值

来看个实例代码：

let obj = {
    name:'tom',
    aget:33,
    mess:{
        like:'爬山'
    }
};
//后面的实例 都是代理的此对象

【例 1 】：我们先将 target ,key, value 的值打印出来看看什么

最低0.47元/天解锁文章