javascript承诺setTimeout

Question

我正在为网站制作老虎机效果。我使用一个用setTimeout（）多次调用自己的函数。我使用setTimeout（）而不是简单的循环，因为我需要效果减慢。这是毫秒派上用场的地方。在此之后我想用不同的参数激发相同的功能。所以我需要知道第一个“循环”何时完成。我试过这个承诺。没有成功。

为了简化问题，有人可以告诉我为什么下面的代码不会触发.then（）方法吗？我是所有这些编程的新手，这是我的第一个问题。我希望这不是我在这里犯的明显错误。

function countDown(i) {
  return promise = new Promise( (resolve, reject) => {

    console.log(i--);

    if (i > 0) {
      setTimeout( () => {
        countDown(i);
      }, 1000);
    } else {
      resolve('counter finished:');
    }

  });

}

let counter = countDown(10);
counter.then( (msg) => {
  console.log(msg);
});

Answer 1

您只需要在递归调用后解析promise，如下所示：

function countDown(i) {
  return promise = new Promise( (resolve, reject) => {

    console.log(i--);

    if (i > 0) {
      setTimeout( () => {
        countDown(i).then(resolve);
      }, 1000);
    } else {
      resolve('counter finished:');
    }

  });

}

let counter = countDown(10);
counter.then( (msg) => {
  console.log(msg);
});

Answer 2

您可能希望使用async / await进行调查，以下是您的示例。

如果您需要定位旧浏览器，您还可以使用Babel / Typescript等。但是大多数现代浏览器已经支持此功能。

function sleep(ms) { return new Promise((resolve) => setTimeout(resolve, ms)) }

async function countDown(i) {
  while (i > 0) {
    console.log(i--);  
    await sleep(1000);
  }
  return "counter finished:";
}

let counter = countDown(10);
counter.then( (msg) => {
  console.log(msg);
});