如何以编程方式获取Proxy中存储的所有对象？

嘿，作为刚接触JavaScript的新手，碰到Proxy的这个问题太正常啦！我来给你一步步捋清楚～

首先得先明白你当前代码里的Proxy行为：你创建的Proxy实例p用了空的handler对象，这意味着所有对p的操作都会默认转发到目标对象target。你给p.a = 1、p.b = 2赋值时，实际上是把这些属性存在了target上，而不是Proxy本身。

那要获取所有属性，有两种简单的方式：

方法1：直接访问目标对象target #

既然属性实际存在target里，直接对target用常规的对象属性获取方法就行：

var target = {};
var p = new Proxy(target, {});
p.a = 1;
p.b = 2;

// 获取所有属性名
console.log(Object.keys(target)); // 输出: ["a", "b"]

// 获取所有属性的键值对
console.log(Object.entries(target)); // 输出: [["a", 1], ["b", 2]]

// 获取所有属性值
console.log(Object.values(target)); // 输出: [1, 2]

方法2：直接从Proxy实例p获取 #

因为你的Proxy没有自定义任何拦截方法，默认的ownKeys（用来获取对象自有属性键的操作）会转发到target，所以直接对p调用同样的方法也能拿到结果：

console.log(Object.keys(p)); // 同样输出: ["a", "b"]
console.log(Object.getOwnPropertyNames(p)); // 输出: ["a", "b"]

扩展：如果Proxy有自定义拦截逻辑怎么办？ #

要是你之后给Proxy加了自定义的set方法，没有把属性存在target里（比如存在自己维护的对象中），那就要手动实现ownKeys等拦截方法，让Object.keys()这类工具能正确拿到属性：

// 自己维护属性存储
const storedProps = {};
const p = new Proxy({}, {
  // 自定义set，把属性存在storedProps里
  set(target, propName, value) {
    storedProps[propName] = value;
    return true; // 必须返回true表示赋值成功
  },
  // 自定义ownKeys，返回我们维护的属性名
  ownKeys() {
    return Object.keys(storedProps);
  },
  // 配合getOwnPropertyDescriptor，让属性能被枚举到
  getOwnPropertyDescriptor(target, propName) {
    return {
      enumerable: true,
      configurable: true,
      value: storedProps[propName]
    };
  }
});

p.a = 1;
p.b = 2;
console.log(Object.keys(p)); // 输出: ["a", "b"]

总结一下，你当前的场景里，用Object.keys(target)或者Object.keys(p)就能轻松拿到所有属性啦～

内容的提问来源于stack exchange，提问作者shadyabhi