有没有JS内置的class方法运行只在引用任何方法时出现一次？

Question

我有一个 class 用于重新加载一些元素。

const getMe = async () => await 
  fetchURL("https://MY.SITE/api/users/me")
    .then((res) => res.data);

class loader {
  EVERYonceWHENmethodCALLED() {
    self.ME = (async () => await getMe())();
  }
  me() {
    $("#me").html(`${self.ME.grade}${self.ME.number}[Tickets: ${self.ME.likeTicket}]`);
  } // ** likeTicket depends on ME **
  async chart() {
    if ($("body").find("#chart").length) {
      const musicChart = await fetchURL(`https://MY.SITE/api/music/chart?&gender=${self.ME.gender}`);
      $("#chart").html(await listElementsOf(musicChart.data.list));
    } // ** listElementsOf depends on ME ( It lets me know what musics I 'liked' to ) **
  }
  async search(q) {
    if ($("body").find("#searchResult").length){
      if(q) $("#searchResult").attr("data-q", q);
      else q = $("#searchResult").attr("data-q");

      const searchResult = await fetchURL(`https://MY.SITE/api/music/search?q=${q}`);
      $("#searchResult").html(await listElementsOf(searchResult));
    }
  }
  meAndChart() {
    self.me();
    self.chart();
  }
  loadEverything() {
    self.meAndChart();
    self.search();
  }
}

我需要在重新加载任何其他元素之前重新加载 ME，我正在寻找一种方法来执行此操作。我可以像 new loader.me(); 一样使用 new，但我不想每次都使用 new。

有没有什么办法可以达到预期的工作？感谢阅读。

Answer 1

我对你的代码做了一些修改：

更改 EVERYonceWHENmethodCALLED 以便 ME 设置为等待的对象而不是承诺。
对当前对象使用 this 而不是 self（有关详细信息，请参阅 here）。
已将 me 和 chart 分别重命名为 _me 和 _chart。
添加了 me 和 chart 方法，它们在 EVERYonceWHENmethodCALLED 之后调用内部方法。
已更新 meAndChart 以在 EVERYonceWHENmethodCALLED 之后调用内部方法。

请注意，使用 await 调用 async 函数通常是一种很好的做法（并且通常是必要的），并且要求调用函数也是 async.

const getMe = async () => await 
  fetchURL("https://MY.SITE/api/users/me")
    .then((res) => res.data);

class loader {
  async EVERYonceWHENmethodCALLED() {
    this.ME = await getMe();
  }
  _me() {
    $("#me").html(`${this.ME.grade}${this.ME.number}[Tickets: ${self.ME.likeTicket}]`);
  } // ** likeTicket depends on ME **
  async _chart() {
    if ($("body").find("#chart").length) {
      const musicChart = await fetchURL(`https://MY.SITE/api/music/chart?&gender=${self.ME.gender}`);
      $("#chart").html(await listElementsOf(musicChart.data.list));
    } // ** listElementsOf depends on ME ( It lets me know what musics I 'liked' to ) **
  }
  async me() {
    await this.EVERYonceWHENmethodCALLED();
    this._me();
  }
  async chart() {
    await this.EVERYonceWHENmethodCALLED();
    await this._chart();
  }
  async search(q) {
    if ($("body").find("#searchResult").length){
      if(q) $("#searchResult").attr("data-q", q);
      else q = $("#searchResult").attr("data-q");

      const searchResult = await fetchURL(`https://MY.SITE/api/music/search?q=${q}`);
      $("#searchResult").html(await listElementsOf(searchResult));
    }
  }
  async meAndChart() {
    await this.EVERYonceWHENmethodCALLED();
    this._me();
    await this._chart();
  }
  async loadEverything() {
    await this.meAndChart();
    await this.search();
  }
}

有没有JS内置的class方法运行只在引用任何方法时出现一次？

Is there any JS built-in class method run only once when any method is referred?

javascript

class

methods

built-in