我该如何做到这一点，当我单击一个按钮时，它将解决一个承诺，如果我再次单击它，它将等到前一个承诺得到解决

Question

  let msg = "Done";
  function promise() {
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve("Done");
      }, 2000);
    });
  }
  async function func1() {
    msg = "Pending";
    console.log("Starting...");
    const a = await promise();
    console.log(a);
    msg = a;
  }

  async function func2() {
    console.log("Queued");
  }

  async function call() {
    if ((msg) === "Done") {
      func1();
    } else {
      func2();
    }
  }

<h1>PROMISE</h1>
<input onclick="call()" type="button" value="Click me " />

我将此代码添加到func2（）中，它在解决上一个承诺后运行func1（），但在单击后也立即运行它。我该怎么做，只有在解决以前的承诺得到解决之后才能运行。

func2() {
  console.log("Queued");
  await func1();
  func1();
}

编辑： 伙计们！我使用date（）。getTime（）方法解决了此问题，并添加“点击”变量。结果几乎相同。但是这样做的方式是不同的。当我单击它立即开始执行Promise时，但是我希望它等到以前点击完成的承诺才能完成，然后才开始执行新的承诺。我认为必须还有其他一些简单的解决方案。

 let msg = "Done";
  let clicks = 0;
  let t1;
  let t2;
  let timeout = 0;
  let txt = "";
  function promise() {
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve("Done");
      }, 2000 * clicks - timeout);
    });
  }
  async function func1() {
    clicks = 1;
    timeout = 0;
    txt = "";
    msg = "Pending";

    let time = new Date();
    t1 = time.getTime();
    const a = await promise();
    let taym = new Date();
    let now = taym.getTime();
    createDiv(now, t1, txt);
    msg = a;
  }

  async function func2() {
    clicks++;
    let time = new Date();
    t2 = time.getTime();
    timeout = t2 - t1;
    const a = await promise();
    let taym = new Date();
    let now = taym.getTime();
    txt = " and " + (now - t2) + " ms after last click";
    createDiv(now, t1, txt);
  }

  async function call() {
    if (msg === "Done") {
      func1();
    } else {
      func2();
    }
  }

  function createDiv(a, b, c) {
    let div = document.createElement("div");
    div.innerHTML = "Created " + (a - b) + " ms after main click" + c;
    document.body.appendChild(div);
  }

<h1>PROMISE</h1>
<input onclick="call()" type="button" value="Click me " />

   

Answer 1

下面的代码执行了我认为您想要

解析事件的操作，只是为了显示第二次单击中显示的时间戳是第一次单击时间戳，因为这就是本示例中的承诺解析的内容，

但不确定此代码有多么有用

const promise = new Promise(resolve => {
  document.getElementById('bang').addEventListener('click', e => {
    console.log('first click');
    resolve(e);
  }, { once: true });
})
promise.then(e => {
  console.log(e.timeStamp, e.type, e.target.id);
  document.getElementById('bang').addEventListener('click', e => {
    promise.then(e => {
      console.log('not the first click');
      console.log(e.timeStamp, e.type, e.target.id);
    })
  })
})

<button id="bang">Resolve the promise</button>