.then（function）不运行功能

Question

我有这个GreaseMonkey的用户脚本。我创建了一个函数（A），该函数调用了另一个函数（B）。我想等待进一步运行A函数，然后等待B函数返回。函数B包含一个按钮，因此实际上我希望A等待按钮按下。

我使用async和await进行了尝试，但这对我没有用，这表明我现在尝试使用.then()选项。在then()中，我创建了一个函数（nextI），以在运行函数B后增加i。

function A(){
    var i = 0
    while (i < 3){
        var data = jsonResponse[i];
        var x = data.x;
        var y = data.y;
        B(x, y).then(
            nextI(i)
        )
    }
)

function B(x, y){
    // do some stuff
    let button = document.getElementById("button");
    button.addEventListener("click", () => {
        console.log("Button clicked.");
        return
   });
}

function nextI(i){
    return i + 1
}

所以我想暂停A直到脚本B完成，然后单击按钮。

Answer 1

在使用.then()之前，您首先必须返回承诺。

function B(x, y){
  return new Promise((resolve, reject) => { 
     // do something here

     let button = document.getElementById("button"); 
     button.addEventListener("click", () => { 
          console.log("Button clicked."); 
          resolve('foo');
     });

  });
}

看看https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

Answer 2

1。 Number按值传递

因此，将i赋予nextI会增加本地副本（即输入参数）。

2。 B不返回Promise

function B(x, y) {
  let button = document.getElementById("button");

  // FIX HERE
  return new Promise(resolve =>
    button.addEventListener("click", () => {
      console.log("Button clicked.");
      resolve('some data')
    })
  )
}

3。 Promise#then接受功能

因此，B (nextI (i))是不正确的，但是B(() => nextI (i))。

N 。其他问题

那里应该还有其他问题。例如，您正在以 fire＆forget 的方式运行返回类型/值为Promise的函数。看看Promise.all或Promise.race。