如何使用JavaScript更改待办事项应用程序的顺序？

我正在用JavaScript开发一个待办应用程序，我想做一个HttpRequest。它不能很好地工作，因为我可以在控制台的最末端看到数据，所以我的GET请求不能正常工作。如何切换它们以在程序结束时获得GET请求

以下是数据响应：

let url = 'here is my url';
let xhr = new XMLHttpRequest();
xhr.onloadend = (event) => {
            return xhr.result;
};

我将标题设置为：

setHeader() {
        xhr.setRequestHeader('Content-Type','application/json');
}

我的get函数如下所示：

get(async, header) {
    return new Promise((resolve, reject) => {
        xhr.open('GET', url, async);
        xhr.setRequestHeader(header.name, header.value);
        xhr.send();
        resolve(xhr.response);
    });
}

---

我必须使用HttpClient和JavaScript，我不能使用jQuery或其他任何东西。

请在构造函数中绑定getAll函数，或者您可以使用箭头函数

export class HttpClient {
  constructor(url) {
    this.url = url;
    this.xhr = new XMLHttpRequest();
    this.xhr.onloadend = event => {
      console.log("ONLOADEND", this.xhr.response);
      return this.xhr.result;
    };

    this.setHeader = this.setHeader.bind(this);
    this.get = this.get.bind(this);
    this.post = this.post.bind(this);
  }

  setHeader() {
    this.xhr.setRequestHeader("Content-Type", "application/json");
  }

  get(async, header) {
    return new Promise((resolve, reject) => {
      this.xhr.open("GET", this.url, async);
      this.xhr.setRequestHeader(header.name, header.value);
      this.xhr.send();
      console.log("xhr", this.xhr.response);
      resolve(this.xhr.response);
      // return nothing
    });
  }

  post(async, data, header) {
    return new Promise((resolve, reject) => {
      this.xhr.open("POST", this.url + "create", async);
      this.setHeader(header);
      this.xhr.send(data);
      console.log("RESPONSE", this.xhr.response);
      resolve(this.xhr.response);
    });
  }
}

export class TodoList extends HttpClient {
  constructor() {
    super("http://todoapp.test/api/");
    this.items = [];
    this.header = new Headers();
    this.header.set("Accept-Encoding", "application/json");

    this.add = this.add.bind(this);
    this.getAll = this.getAll.bind(this);
  }

  add(todo) {
    this.post(true, JSON.stringify(todo), this.header);
    this.items.push(todo);
  }

  getAll() {
    this.get(true, this.header).then(result => {
      const data = !!result ? result : "[]";
      const items = JSON.parse(data);
      console.log("result:", result);
      items.forEach(item => {
        const todo = new Todo(item.id, item.name, item.status);
        this.items.push(todo);
      });
      console.log("items block:", this.items);
    });
  }
}

---

这三个片段看起来不像是单个脚本的一部分；您能否显示实际的代码，包括如何调用

get（）

？您所说的

在程序末尾有GET请求是什么意思？我搞不懂，我同意上面的说法。如果您可以在小提琴手/画笔上重现这一点，或者至少粘贴您在控制台最末端看到的数据。let items=[]；getAll（）{httpClient.get（true，this.header）。然后（（result）=>{const data=！！result？result:'[]；const items=JSON.parse（data）；items.forEach（item=>{const todo=new todo（item.id，item.name，item.status）；items.push（todo）；}；}）；}我首先在这里使用“get”请求，我希望它在“onloadend”函数之后运行。@vargaadam您使用的是React、Angular还是Vue？@JayVaghasiya我使用的是香草Javascript有两类查询。这是正确的版本@JayVaghasiya@vargaadam你还是需要绑起来，对吗？如果没有绑定，您无法访问任何函数中的构造函数，或者如果您不想绑定，请使用箭头函数。您可以提供错误信息吗？遗憾的是，您的版本仍然存在问题。控制台中的答案按以下顺序显示：xhr结果：项块：[]ONLOADEND，我希望按以下顺序显示：ONLOADEND xhr结果：项块：[]todo list.js:34 Uncaught TypeError:无法读取TODOLAST.getAll（todo list.js:34）中TodoApp.load中未定义的属性“get”（todo app.js:100）在index.js:4这将不会在我的“getAll”函数中加载“get”函数。@Vargadam现在我认为它的绑定问题请绑定构造函数中的所有函数，如
This.getAll=This.getAll.bind（This）；
另外，我已经更新了我的代码，请检查这两个类的构造函数