本文讲解如何使用 es6 proxy 创建一个始终返回自身（且可被 for...of 正确遍历）的代理数组，关键在于拦截 `symbol.iterator` 等内置符号属性，而非仅处理字符串键。
在 JavaScript 中，for...of 循环并非简单访问 length 或调用 push，而是依赖对象是否具备有效的 Symbol.iterator 方法——即该对象是否实现了可迭代协议（iterable protocol）。当你用 Proxy 包裹空数组并返回自身（如 return p）时，若未显式透传 Symbol.iterator，for...of 就会因找不到合法迭代器而抛出 TypeError: ... is not iterable。
✅ 正确做法：透传 Symbol 属性与关键数组方法
核心原则是：所有 symbol 类型的属性（尤其是 Symbol.iterator）必须原样返回目标对象（obj）上的对应值；同时，首次访问时自动将代理自身推入数组，确保 length === 1 且内容为循环引用。
以下是完整、健壮的实现：
const p = new Proxy([], {
get(obj, prop) {
// 首次访问任意属性时，向原数组中推入自身（确保 length === 1）
if (obj.length === 0) {
obj.push(p);
}
// 透传所有 Symbol 属性（含 Symbol.iterator、Symbol.toStringTag 等）
// 以及关键数组方法（避免 for...of / Array.isArray / JSON.stringify 失败）
if (typeof prop === 'symbol' ||
['length', 'push', 'pop', 'forEach', 'map', 'filter', 'reduce', 'toString', 'join'].includes(prop)) {
return obj[prop];
}
// 其他任意字符串属性均返回代理自身，形成链式响应
return p;
}
});? 验证效果
// ✅ 可被 for...of 正确遍历
for (let v of p) {
console.log(v === p); // true（输出一次）
}
// ✅ 支持嵌套访问（p.any.any.any... 均为同一代理）
console.log(p.any.any === p); // true
// ✅ 兼容数组常用方法
console.log(p.map(x => x === p)); // [true]
console.log(p.length); // 1
console.log(Array.isArray(p)); // true（因 Proxy 继承自 Array 原型且透传 isArray 所需内部逻辑）
// ✅ JSON 序列化安全（避免循环引用报错）
console.log(JSON.stringify(p, null, 2));
// 输出：[ "[Circular]" ]（取决于环境，但不会崩溃）⚠️ 注意事项
- 不要写 p.push(p)：这会触发 get 拦截器再次执行，导致无限递归。应始终操作原始目标对象 obj.push(p)。
- 仅透传必要方法：过度透传（如 __proto__、constructor）可能破坏代理语义；聚焦于迭代、长度、基础操作即可。
- Symbol.iterator 是关键：它是 for...of、扩展运算符（[...p]）、解构赋值等语法的底层依赖，缺失即失效。
- 调试提示：可通过 console.dir(p) 查看代理结构，并用 Object.getOwnPropertySymbols(p) 检查符号属性是否可用。
通过精准控制 get 拦截器对 symbol 和关键字符串属性的响应策略，你就能构建出既符合数组语义、又具备“自引用+可迭代”特性的 Proxy 对象——完美适配数据映射层的测试与模拟需求。
