Question

我正在创建一个游戏，其中用户编写将执行的功能，并执行诸如移动机器人/旋转等功能。我有这个代码：

  function move(){
    setTimeout(function(){
      console.log("Log 1,5");
    }, 3000);

    return true;
  }

  function anotherMove(){
    setTimeout(function(){
      console.log("Log 2,5");
    }, 2000);

    return true;
  }

  function action(){
    console.log("Log 1");
    move();
    console.log("Log 2");
    anotherMove();
    console.log("Log 3");
  }


  action();

想象一下，移动/ anotherMove作为机器人移动，console.logs作为这些移动之间的计算。无论如何都要正确输出日志：1 - ＆gt; 1,5 - ＆gt; 2 - ＆gt; 2,5（当前它的1 - > 2 - > 3 - > 1,5 - > 2,5）所以基本上console.log在执行这些日志之前等待move / anotherMove完成。

我可以改变move / anotherMove结构（它将是画布动画），但我需要action（）结构保持不变......

非常感谢！

Answer 1

承诺做你正在寻找的东西。这些在ES6中可用，或者有几个库，例如Q。

你将在承诺中开始包装超时......

function timeout(ms) {
    return new Promise(function (resolve, reject) {
        setTimeout(resolve, ms);
    });
}

现在超时函数将返回一个promise，它可以使用函数then()与另一个promise链接。因此，例如，您的move()功能可以改进为......

function move(aString, aDelay) {
    return timeout(aDelay).then( () => {
        console.log(aString);
        true;
    });
}

动作功能几乎写出来......

function action() {
    console.log("Log 1");
    return move("Log 1.5", 3000).then(() => {
        console.log("Log 2");
        move("Log 2.5", 2000);
    }).then(() => {
        console.log("Log 3");
    });
}

在执行下一个命令之前等待功能完成

1 个答案: