解析 JavaScript 代理 object 中的 promise

Question

我正在尝试创建一个 JavaScript 代理，它允许我深入遍历对象的属性，但是当我运行一个方法时，我希望它返回一个带有新代理的 promise，它可以让我深入遍历 ZA8CFDE6331BD59EB2AC96B8。

例子：

const foo = createProxy()
const result = await foo.any.number.of.properties.deep()
const result2 = await result.foo.bar()
const result3 = await result2.off.we.go.again()

我尝试创建 function 的代理，当我想从方法调用同步返回代理时，这有效，但是当我尝试返回 promise 时，它会无限循环。

但是，当我捕获then属性并尝试运行回调以将代理传递给它时，我用无限循环破坏了浏览器。

const createProxy = <T>(path) => {
  return new Proxy(function () {}, {
    apply(_target, _thisArg, _args) {
      console.log("exec", path);
      return createProxy([]);
    },
    get(_target, key) {
      if (key === "then") {
        return (cb) => {
          cb(createProxy([...path, key]));
        };
      }
      return createProxy([...path, key]);
    },
  });
};

Answer 1

实现 promise 的 object 不能是另一个 thenable - 否则resolve()算法将尝试等待嵌套的 promise。

在您的情况下，最简单的选择是从方法调用返回一个由代理实现的 promise，而不是 promise 的代理，并使您的代理不可用：

function createProxy<T>(path = []) {
  return new Proxy(function () {
    console.log("exec", path);
    return Promise.resolve(createProxy([]));
  }, {
    get(_target, key) {
      if (typeof key === 'string' && key !== "then")
        return createProxy([...path, key]);
      else
        return Reflect.get(...arguments);
    },
  });
}

顺便说一句，请注意，要让await工作，您甚至不需要从方法调用中返回 promise - 正常值也可以。 只需确保它不是 thenable，或者它的then方法按要求工作。