现在工作不好找的环境中,想要更好获得工作机会,让我们一起准备面试题吧~
一、Proxy 核心概念
1. 代理模式本质
Proxy(代理)是 ES6 引入的元编程特性,通过中间层拦截机制实现对目标对象的访问控制。其核心能力体现在:
2. 代理对象特征
- 透明访问:代理对象与原生对象操作方式完全一致
- 无副作用创建:不会修改原始对象本身
- 链式代理:可对代理对象再次进行代理
- 可撤销代理:通过 Proxy.revocable() 创建可取消的代理
二、13 种拦截操作详解
拦截方法 | 触发场景 | 典型应用 |
get | 读取属性 | 访问日志、计算属性 |
set | 设置属性 | 数据验证、自动持久化 |
apply | 函数调用 | 函数节流、调用跟踪 |
construct | new 操作 | 单例模式、类扩展 |
has | in 操作符 | 属性隐藏 |
deleteProperty | delete 操作 | 防止属性删除 |
ownKeys | Object.keys() 等操作 | 属性过滤 |
getPrototypeOf | Object.getPrototypeOf() | 原型控制 |
setPrototypeOf | Object.setPrototypeOf() | 原型锁定 |
isExtensible | Object.isExtensible() | 对象扩展控制 |
preventExtensions | Object.preventExtensions() | 强制不可扩展 |
getOwnPropertyDescriptor | Object.getOwnPropertyDescriptor() | 属性描述符控制 |
defineProperty | Object.defineProperty() | 属性定义拦截 |
三、高频面试题
1:Proxy 与 Object.defineProperty 的核心差异?
得分点解析:
- 拦截维度:
Proxy 拦截对象级别操作(13种方法)
defineProperty 拦截属性级别操作(仅 get/set)
- 数组处理:
Proxy 直接支持数组索引修改
defineProperty 需要重写数组方法
- 性能表现:
Proxy 初始化更快(惰性代理)
defineProperty 需要预先递归遍历
- 动态属性:
Proxy 自动检测新增属性
defineProperty 需手动处理
2:如何实现深度代理嵌套对象?
核心:递归遍历,上面方法实现其实和深拷贝的逻辑相似。
Reflect作用:保持默认行为的一致性,有兴趣的同学可以去网上搜索看看。
3:Proxy 在性能优化中的应用?
利用 Proxy 可以对一些复杂运算的结果做缓存,提升应用的性能,如:
调用函数时被代理劫持,然后判断参数是否已经被计算过,如果已经被计算直接返回计算结果,不再做一次复杂运算。此方法在被问到如何优化应用性能时也可以说,加分的哦。