Question

我试图在JS中创建模块化代码，并且在将具有值的变量传递给同一类中的另一个方法时遇到麻烦。我现在看到的结果是“”。请帮忙！

class foodApp {
  
  constructor() {
     this.getjsondata = ''
  }
  

  fetchData() {
      return fetch("https://jsonplaceholder.typicode.com/users")
        .then(response => response.json())
        .then(data => {
            const result = JSON.stringify(data);
            this.getjsondata = result;
      })
  }
  
 displayHTML() {
    return console.log(this.getjsondata)
  }

}

new foodApp().displayHTML();

Answer 1

fetchData是一个异步函数，它将返回一个Promise。你必须兑现诺言。

尝试以下代码。

class FoodApp {
  constructor() {
    this.getjsondata = "";
  }

  fetchData() {
    return fetch("https://jsonplaceholder.typicode.com/users")
      .then(response => response.json())
      .then(data => {
        const result = JSON.stringify(data);
        this.getjsondata = result;
      });
  }

  displayHTML() {
    return this.getjsondata;
  }
}

let foodApp = new FoodApp();

(async function() {
  await foodApp.fetchData();
  console.log(foodApp.displayHTML());
})();

Answer 2

如果您希望fetchData始终与每个实例一起运行（我认为您可能会这样做），则将函数内容包括在构造函数中，而不是在单独的方法中。否则，当您第一次调用displayHTML时，还没有发生。

constructor() {
      fetch("https://jsonplaceholder.typicode.com/users")
        .then(response => response.json())
        .then(data => {
            const result = JSON.stringify(data);
            this.getjsondata = result;
      })
  }

如何将变量从一种方法传递到同一类中的另一种方法

2 个答案: