Proxy 和 Object.defineProperty 都可以用来拦截和操作对象的属性访问，但它们在功能、灵活性和适用场景上有显著的区别。
1. Object.defineProperty
功能
- 用于定义或修改对象的属性，包括属性的值、可写性、可枚举性、可配置性等。
- 主要用于对单个属性进行细粒度的控制。
使用场景
- 对象属性的拦截和修改，例如：
- 定义 getter 和 setter。
- 修改属性的配置。
示例代码
const obj = {}; Object.defineProperty(obj, 'name', {value: 'Alice',writable: true,enumerable: true,configurable: true, });console.log(obj.name); // Alice Object.defineProperty(obj, 'name', {get() {return 'Bob';} });console.log(obj.name); // Bob
限制
- 只对定义的属性有效，不能拦截对对象的整体访问或操作。
- 需要针对每个属性分别进行定义，无法一次性处理多个属性或整个对象。
2. Proxy
功能
- 用于创建一个代理对象，该对象可以拦截并自定义对目标对象的基本操作（如属性访问、赋值、删除等）。
- 提供了更多的拦截能力和灵活性，支持对整个对象的操作。
使用场景
- 可以用来拦截和修改对象的所有操作，例如：
- 属性的读取、赋值、删除。
- 函数调用。
- 目标对象的创建和扩展。
示例代码
const target = {name: 'Alice' };const handler = {get(target, property) {return property in target ? target[property] : 'Default';},set(target, property, value) {target[property] = value.toUpperCase();return true;} };const proxy = new Proxy(target, handler);console.log(proxy.name); // Alice proxy.name = 'Bob'; console.log(proxy.name); // BOB console.log(proxy.age); // Default
优点
- 可以拦截对象的所有操作，提供更全面的控制。
- 可以动态地应用拦截逻辑，不需要修改原始对象的定义。