javascript - 嵌套for循环，每个循环单独延迟

Question

一个简单的嵌套 for 循环示例:

for (let i=0; i<=2; i++) {
  for (let j=0; j<=1; j++){
    console.log("i is: " + i);
    console.log("j is: " + j);
    console.log("---");
  }
}

有延迟的嵌套 for 循环:

for (let i=0; i<=2; i++) {
  for (let j=0; j<=1; j++){
    task(i,j);
  }
} 

function task(i,j) { 
  setTimeout(function() { 
    console.log("i is: " + i);
    console.log("j is: " + j);
    console.log("---")
  }, 1000 * i);
}

现在我的问题是
如何分别延迟每个循环。
当前输出(忽略“---”):
i, j, 延迟, i, j, 延迟, ...
期望的输出(忽略“---”):
我，延迟，j，延迟，我，延迟，j，延迟...
我尝试了下面的事情(但它返回了一个完全错误的输出)

for (let i=0; i<=2; i++) {
  for (let j=0; j<=1; j++){
    taski(i);
    taskj(j)
  }
} 

function taski(i) { 
  setTimeout(function() { 
    console.log("i is: " + i);
  }, 1000 * i);
}
function taskj(j){
  setTimeout(function() { 
    console.log("j is: " + j);
    }, 1000 * j);
}

Answer 1

您可以使用 Promise和 async/await处理顺序调用

function taski(i) {
  return new Promise(function (resolve) {
    setTimeout(function () {
      console.log("i is: " + i)
      resolve()
    }, 1000 * i)
  })
}
function taskj(j) {
  return new Promise(function (resolve) {
    setTimeout(function () {
      console.log("j is: " + j)
      resolve()
    }, 1000 * j)
  })
}

async function execute() {
  for (let i = 0; i <= 2; i++) {
    for (let j = 0; j <= 1; j++) {
      await taski(i)
      console.log("delay")
      await taskj(j)
      console.log("delay")
    }
  }
}

execute()

引用:

async function

Promise