如何为Promise添加自定义属性或方法以优化嵌套调用？

嘿，这个场景我太懂了！每次处理那种返回带Promise属性的对象时，一堆.then(obj => obj.xxx)的链式调用真的能把代码搞得乱糟糟的。我来分享两个亲测好用的方案，帮你简化这种调用：

我们可以创建一个Promise的子类，在它身上附加自定义的getter或者方法，直接返回对应属性的Promise，省去手动写.then()的麻烦。

举个适配clientside-require场景的例子：

// 定义增强版Promise子类
class EnhancedPromise extends Promise {
  // 快捷获取data属性的Promise
  get data() {
    return this.then(result => result.data);
  }

  // 快捷获取user属性的Promise
  get user() {
    return this.then(result => result.user);
  }

  // 通用属性获取方法，支持动态传参
  getProp(propName) {
    return this.then(result => result[propName]);
  }
}

// 使用示例：假设fetchUser返回的是resolve为{user: Promise<{name: string}>}的EnhancedPromise
const userPromise = EnhancedPromise.resolve(fetchUser());

// 之前你可能要写：
userPromise.then(obj => obj.user).then(user => console.log(user.name));

// 现在可以直接简化成：
userPromise.user.then(user => console.log(user.name));
// 或者用通用方法处理任意属性：
userPromise.getProp('user').then(user => console.log(user.name));

如果不想创建子类，用Proxy包装Promise是更灵活的选择——当你访问包装后对象的属性时，Proxy会自动帮你生成对应的.then()调用，返回新的Promise，甚至支持多层属性链式访问。

示例代码：

function wrapPromise(promise) {
  return new Proxy(promise, {
    get(target, prop) {
      // 如果是Promise原生方法（then/catch/finally），直接返回原方法
      if (prop in target) {
        return target[prop].bind(target);
      }
      // 否则自动生成获取该属性的Promise，并且继续包装以便链式访问
      return wrapPromise(target.then(result => result[prop]));
    }
  });
}

// 使用示例：
const wrappedPromise = wrapPromise(fetchUser());

// 直接链式访问多层属性，完全不用手动写then！
wrappedPromise.user.name.then(name => console.log(name));
// 如果属性本身也是Promise，Proxy会自动帮你解析，一步到位

• 如果你用clientside-require，确保运行环境支持ES6类或Proxy（现代浏览器都没问题，兼容旧环境的话需要转译）。
• 自定义属性时要避开Promise原生的方法名（比如then、catch），避免冲突。
• 使用Proxy时，记得用.catch()捕获属性不存在等异常情况，避免未处理的Promise rejection。

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