如何在 javascript class 中更改 class 构造函数的内容并在以后访问它？

Question

编辑：我有一个 demo here

我想从 API 中获取数据，将其添加到 class 的构造函数中，然后 在按钮上单击 将其显示到页。

class Entry {
  constructor() {
    this.pages = [];
  }
  loadAllEntries(url) {
    fetch(url)
      .then((response) => response.json())
      .then((data) => {
        this.pages = data;
        // this would do it autuomatically, it's not what I want
        //this.displayAllEntries("#notes-list");
      });
  }

  displayAllEntries(node) {
    let ul = document.createElement("ul");
    ul.id = "display-list-note";
    this.pages.map((page) => { 
      let li = document.createElement("li");
      li.innerText = page.title;
      ul.appendChild(this.createClickableItem(page));
    });
    document.querySelector(node).appendChild(ul);
  }
  createClickableItem(item) {
    let li = document.createElement("li");
    li.innerText = item.title;
    li.addEventListener("click", () => {
        console.log(item.id);
    });
    return li;
  }
}

const courses = new Entry();
courses.loadAllEntries("http://localhost:1338/courses?favorite=true");

// on some click I want to run 

courses.displayAllEntries("#notes-list");

但是，displayAllEntries 就好像 loadAllEntries 从来没有运行!

稍后我想做类似 courses.deleteEntry(213) 的事情，并更改构造函数的内容（一种美化的待办事项列表类型）

编辑：我有一个 demo here

Answer 1

解决此问题的最小方法如下：

return 获取的承诺

    loadAllEntries(url) {
      // just return, no further changes required
      return fetch(url)
        .then(...

在顶层，在完成提取后 then

const courses = new Entry();
const url = "http://localhost:1338/courses?favorite=true";
courses.loadAllEntries(url).then(() => {
  courses.displayAllEntries("#notes-list");
});

如果底层方法有效，这将有效。

如何在 javascript class 中更改 class 构造函数的内容并在以后访问它？

How to change the contents of a class construcor in a javascript class and access it later?

javascript

oop

javascript-objects