如何利用 Proxy 对象构建一个真正不可变的数据结构？

答案：通过Proxy递归拦截所有属性操作并冻结原始数据，可实现深度不可变对象。具体包括利用set、deleteProperty等陷阱阻止修改，结合递归处理嵌套对象，确保深层防护，同时注意性能开销与引用暴露问题。

JavaScript 中的“不可变”通常靠约定或工具库实现，但很多方案只是浅层防护。要构建真正不可变的数据结构，可以利用 Proxy 捕获所有属性操作，从底层阻止任何修改行为。

1. 理解 Proxy 的拦截能力

Proxy 能拦截对象的多种操作，比如读取、写入、删除、枚举等。通过拦截关键陷阱（traps），可以在任何尝试修改对象时抛出错误。

核心陷阱包括：

• set：拦截属性赋值
• deleteProperty：拦截 delete 操作
• defineProperty：拦截 Object.defineProperty
• getOwnPropertyDescriptor：配合 preventExtensions 使用
• preventExtensions 和 isExtensible：控制对象是否可扩展

2. 创建深度不可变代理

仅代理顶层对象不够，嵌套对象仍可能被修改。需要递归代理每个子对象，确保深层防护。

以下是一个创建真正不可变对象的函数：

即构数智人

即构数智人是由即构科技推出的AI虚拟数字人视频创作平台，支持数字人形象定制、短视频创作、数字人直播等。

36

查看详情

function deepFreezeProxy(obj) {
  if (typeof obj !== ‘object’ || obj === null) return obj;
  if (Object.isFrozen(obj)) return obj;

  return new Proxy(obj, {
    set(target, prop) {
      throw new Error(`Cannot assign to property ‘${prop}’ on immutable object`);
    },
    deleteProperty(target, prop) {
      throw new Error(`Cannot delete property ‘${prop}’ from immutable object`);
    },
    defineProperty(target, prop, descriptor) {
      throw new Error(`Cannot define property ‘${prop}’ on immutable object`);
    },
    preventExtensions(target) {
      return false;
    },
    isExtensible(target) {
      return false;
    }
  });
}

3. 实际使用示例

使用上面的函数包装一个复杂对象：

const state = deepFreezeProxy({
  user: {
    name: ‘Alice’,
    preferences: { theme: ‘dark’ }
  }
});

// 以下所有操作都会抛错
// state.user.name = ‘Bob’;
// delete state.user;
// Object.defineProperty(state, ‘newProp’, {});
// Object.preventExtensions(state);

即使嵌套属性也被保护，因为 deepFreezeProxy 在代理前先递归处理了所有层级。

4. 注意事项与局限

虽然 Proxy 提供强大控制力，但仍需注意：

• Proxy 只代理直接操作，若引用原始对象未被封闭，仍可能绕过。确保不暴露内部可变副本
• 性能开销：每次属性访问都经过 trap，频繁操作时需权衡
• 某些方法如 Object.keys() 仍能读取属性，这是预期行为——只阻止写入
• Symbol 属性和原型链操作也应考虑是否需要拦截

基本上就这些。用 Proxy 构建不可变结构的关键是全面拦截变更操作，并递归应用到嵌套对象，同时冻结原始数据防止旁路修改。这样就能实现比 Object.freeze 更可靠、更可控的深度不可变性。