我有两个JS函数。一个打电话给另一个。在调用函数中，我想调用另一个函数，等待该函数完成，然后继续。因此，例如/伪代码:
function firstFunction(){
for(i=0;i<x;i++){
// do something
}
};
function secondFunction(){
firstFunction()
// now wait for firstFunction to finish...
// do something else
};
我想出了这个解决方案，但不知道这是否是一个聪明的方法。
var isPaused = false;
function firstFunction(){
isPaused = true;
for(i=0;i<x;i++){
// do something
}
isPaused = false;
};
function secondFunction(){
firstFunction()
function waitForIt(){
if (isPaused) {
setTimeout(function(){waitForIt()},100);
} else {
// go do that thing
};
}
};
这合法吗?有没有更优雅的处理方式?也许是用jQuery?
等待一个函数先完成的一种优雅方法是使用Promises和async/await函数。
首先，创建一个承诺。
我创建的函数将在2s后完成。我使用
setTimeout来演示
指令需要一些时间来执行。
对于第二个函数，您可以使用
异步/等待
等待第一个函数完成的函数
在继续执行指令之前。
例子:
//1. Create a new function that returns a promise
function firstFunction() {
return new Promise((resolve, reject) => {
let y = 0
setTimeout(() => {
for (i=0; i<10; i++) {
y++
}
console.log('Loop completed.')
resolve(y)
}, 2000)
})
}
//2. Create an async function
async function secondFunction() {
console.log('Before promise call.')
//3. Await for the first function to complete
const result = await firstFunction()
console.log('Promise resolved: ' + result)
console.log('Next step.')
};
secondFunction()
注意:
您可以像resolve()那样简单地解析Promise而不包含任何值。在我的例子中，我用y值解析了Promise，然后可以在第二个函数中使用y值。
试试这个
function firstFunction(){
// do something
X=true;
return X;
}
function secondFunction(){
X=false;
X=firstFunction();
setTimeout( function() {
if(X==true){
// do something else
}else{
// do something else
}
alert(X); // To check X
}, 100); // Can increase time delay 200,300, ...
}
将时间从100增加到200,300，…基于firstFunction完成所需的时间
处理异步工作的一种方法是使用回调函数，例如:
function firstFunction(_callback){
// do some asynchronous work
// and when the asynchronous stuff is complete
_callback();
}
function secondFunction(){
// call first function and pass in a callback function which
// first function runs when it has completed
firstFunction(function() {
console.log('huzzah, I\'m done!');
});
}
根据@Janaka Pushpakumara的建议，你现在可以使用箭头函数来实现同样的事情。例如:
firstFunction(() => console.log('huzzah, I\'m done!'))
更新:我很早就回答了这个问题，真的很想更新它。虽然回调是绝对好的，但根据我的经验，它们往往会导致代码更难阅读和维护。但在某些情况下，我仍然使用它们，例如将进度事件作为参数传递。这次更新只是强调替代方案。
另外，最初的问题并没有特别提到async，所以如果有人感到困惑，如果你的函数是同步的，它将在调用时阻塞。例如:
doSomething()
// the function below will wait until doSomething completes if it is synchronous
doSomethingElse()
如果正如暗示的那样，函数是异步的，那么我现在处理所有异步工作的方式是async/await。例如:
const secondFunction = async () => {
const result = await firstFunction()
// do something else here after firstFunction completes
}
在我看来，async/await使你的代码比直接使用promises(大多数时候)更具可读性。如果你需要处理捕获错误，那么使用try/catch。更多信息请点击:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function。
