Question

我有3个函数StepONE，StepTWO，StepTHREE按顺序运行它们。这是按顺序运行的正确方法：

此外，在使用StepTWO(StepTHREE());时序列出错了，所以我这样做是为了让它工作：StepTWO(function() { StepTHREE() });

<div id="stepslog"></div>
<div id="count"></div>
<button onclick="Steps()">Start </button>
<script>
 function Steps() {
  StepONE(function() {
    <!-- StepTWO(StepTHREE()); -->
    StepTWO(function() {
      StepTHREE()
    });
    alert('FINISHED WITH BOTH STEPS');
  });
}
function StepONE(callback) {
  <!-- alert('Step ONE'); -->
  document.getElementById('stepslog').innerHTML += '<hr>Step ONE';
  for (i = 1; i < 700; i++) {
    var abc = document.getElementById("count");
    abc.innerHTML += '<br>' + i;
  }
  callback(itemexists);
}
function StepTWO(callback, itemexists) {
  <!-- alert('Step TWO'); -->
  document.getElementById('stepslog').innerHTML += '<hr>Step TWO';
  callback();
}
function StepTHREE() {
  document.getElementById('stepslog').innerHTML += '<hr>Step THREE';
}
</script>

更新：

如何从函数2＆amp;中返回值？ 3并最终在StepONE（）函数中使用它？回调（itemexists）....这是正确的吗？

Answer 1

尝试使用Promise.resolve并链接其余功能

function Steps() {
  Promise.resolve(StepONE()).then(function(x) {
    console.log('From 1st function ', x);
    return StepTWO();
  }).then(function(y) {
    console.log('From 2nd function ', y);
    StepTHREE();

  })
}

function StepONE() {
  document.getElementById('stepslog').innerHTML += '<hr>Step ONE';
  for (i = 1; i < 700; i++) {
    var abc = document.getElementById("count");
    abc.innerHTML += '<br>' + i;
  }
  return 'Return from ONE';
}

function StepTWO() {
  document.getElementById('stepslog').innerHTML += '<hr>Step TWO';
  return 'Return from TWO';
}

function StepTHREE() {
  document.getElementById('stepslog').innerHTML += '<hr>Step THREE';
}

<div id="stepslog"></div>
<div id="count"></div>
<button onclick="Steps()">Start </button>

Answer 2

你这样做太复杂了。

如果你想按顺序运行三个函数，一个接着一个，只需按顺序编写调用：

stepOne();
stepTwo();
stepThree();

这将一个接一个地调用列出的三个函数。在调用下一个函数之前，每个函数都将完全执行它。

这是运行JavaScript函数的常规和预期方式。您不需要回调或承诺，也不需要任何回复。只需调用函数。

关于您的更新，如果您需要从一个函数返回一个值，然后将该值传递给另一个函数，只需执行以下操作：

let valOne = stepOne();
let valTwo = stepTwo( valOne );
stepThree( valTwo );

现在，如果您正在处理服务器请求或其他任何异步，那么这是一个不同的故事。但是你的问题没有任何表明这一点。顺序执行是JavaScript工作的常规方式，因此只需使用它，除非您需要不同的东西。

Javascript按顺序执行多个函数

2 个答案: