对象内Promise无法解析求助：异步方法跨方法调用数据失败

嘿，我一眼就看出问题所在啦——你的getText()方法没有返回fetch生成的Promise链，导致在fillText()里调用它时拿不到有效的Promise，自然没法解析异步数据。咱们来一步步修复它：

核心问题分析 #

你原来的getText()里只是执行了fetch操作，但没有把这个异步操作的Promise返回出去。JavaScript中如果函数没有显式return值，默认会返回undefined。所以当你在fillText()里调用this.getText().then(...)时，实际上是在undefined上调用.then()，这肯定会出错。

修正后的代码 #

首先修改getText()，让它返回整个fetch的Promise链：

const translator = {
  currentLanguage: '',
  getText() {
    // 关键：返回fetch的Promise链，不需要额外包裹新的Promise
    return fetch('js/text.json')
      .then(res => res.json())
      .then(res => {
        console.log(res);
        return res; // 直接返回数据，上层Promise会解析为这个值
      });
  },
  fillText(lang) {
    this.getText()
      .then((res) => {
        console.log('in fill text: ');
        console.log(res);
        // 这里可以根据传入的lang参数处理对应语言的文本，比如res[lang]
      })
      .catch(err => {
        // 务必添加错误捕获，避免未处理的Promise报错
        console.error('加载文本文件失败:', err);
      });
  },
  checkLanguage() {
    // 假设这里是检测并设置当前语言的逻辑
    this.currentLanguage = 'zh-CN';
  }
};

translator.checkLanguage();
translator.fillText(translator.currentLanguage);

更简洁的写法：用async/await #

如果你的环境支持ES2017+，可以用async/await让异步代码更易读：

const translator = {
  currentLanguage: '',
  async getText() {
    try {
      const res = await fetch('js/text.json');
      const data = await res.json();
      console.log(data);
      return data;
    } catch (err) {
      console.error('加载文本失败:', err);
      throw err; // 抛出错误让上层处理
    }
  },
  async fillText(lang) {
    try {
      const res = await this.getText();
      console.log('in fill text: ');
      console.log(res);
      // 处理对应语言的文本逻辑
    } catch (err) {
      console.error('填充文本失败:', err);
    }
  },
  checkLanguage() {
    this.currentLanguage = 'zh-CN';
  }
};

translator.checkLanguage();
translator.fillText(translator.currentLanguage);

额外注意事项 #

• 永远不要忽略Promise的错误处理，添加.catch()或者try/catch可以避免控制台出现未捕获的Promise异常。
• 如果text.json的路径不对，fetch会失败，所以错误处理很重要。

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