Question

我需要一些帮助...我在javascript中有5个函数，我无法在之前的函数之后调用第五个函数。我有一些这样的：

function one(){

}
function two(){

}
function three(){

}
function four(){

}
function five(){

}

此代码在其他函数之前执行函数“five（）”。我希望只有在所有先前的函数完成后才会执行five（）。我怎样才能做到这一点？

编辑：这是我的电话

function callFunction(){
    one();
    two();
    three();
    four();
    five();
}

Answer 1

最好的解决方案是使用promises。承诺是非常容易的异步过程。你需要Promise.all（可迭代）。

Promise.all（iterable）方法返回一个解析时间的promise 可迭代参数中的所有promise都已解决或拒绝由于第一个通过的拒绝承诺的原因。

var p1 = Promise.resolve(3);
var p2 = 1337;
var p3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, "foo");
}); 

Promise.all([p1, p2, p3]).then(function(values) { 
  console.log(values); // [3, 1337, "foo"] 
});

检查一下：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

如果您想要IE兼容性，可以使用q。

https://github.com/kriskowal/q

q也有.all。

我为你写了这个例子：

/**
 * Example of Q.all usage
 * @author Georgi Naumov
 * gonaumov@gmail.com for contacts and
 * suggestions.
 */
var firstStep = (function () {
    var dfd = Q.defer();
    setTimeout(function () {
        console.log("first step  finished");
        dfd.resolve();
    }, 1000);
    return dfd.promise;
}());

var secondStep = (function () {
    var dfd = Q.defer();
    setTimeout(function () {
        console.log("second step  finished");
        dfd.resolve();
    }, 3000);
    return dfd.promise;
}());

Q.all([firstStep, secondStep]).then(function () {
    console.log('All done!');
});

console.log（'全部完成！'）;将在所有asinc任务完成时执行。

这是jsfiddle：

http://jsfiddle.net/drv4538t/3/

此解决方案与时间间隔无关。检查此示例：

/**
 * Example of Q.all usage
 * @author Georgi Naumov
 * gonaumov@gmail.com for contacts and
 * suggestions.
 */

/**
 * This function is taken from:
 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random
 */
function getRandomIntInclusive(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

var firstStep = (function () {
    var dfd = Q.defer();
    setTimeout(function () {
        console.log("first step  finished");
        dfd.resolve();
    }, getRandomIntInclusive(1000, 10000));
    return dfd.promise;
}());

var secondStep = (function () {
    var dfd = Q.defer();
    setTimeout(function () {
        console.log("second step  finished");
        dfd.resolve();
    }, getRandomIntInclusive(1000, 10000));
    return dfd.promise;
}());

Q.all([firstStep, secondStep]).then(function () {
    console.log('All done!');
});

这是jsfiddle：

http://jsfiddle.net/drv4538t/4/

Answer 2

你的电话在哪里？这个过程是异步的吗？

否则只需致电：

one();
two();
...
five();

修改

由于它们是异步函数，您必须在上一个异步过程结束时执行下一个函数，如下所示：

function one(){ setTimeout(function(){ //Do async process two(); }, 1000); } function two(){ setTimeout(function(){ //Do async process three(); }, 1000); } function three(){ setTimeout(function(){ // etc... }, 1000); } one();

Answer 3

/* declare functions */        
function one(){
  two()
}
function two(){
  three()
}
function three(){
   four()
}
function four(){
   five()
}
function five(){

}

/* call function */ 
one()

Answer 4

一个简单的解决方案可以是：

function one(){
  console.log('one')
}
function two(){
  console.log('two')
}
function three(){
  console.log('three')
}
function four(){
  console.log('four')
}
function five(){
  console.log('five')
}

['one','two','three','four','five'].forEach(function(fun){
  window[fun]();
})

Answer 5

你可以在运行函数5之前为你想要完成的每个函数设置一个布尔值为true。然后尝试在每个函数结束时运行函数5 ...如果所有函数都已完成且函数5没有完成运行，你运行功能5.

        var f1Finished = false;
        var f2Finished = false;
        var f3Finished = false;
        var f4Finished = false;
        var ran5 = false;
        function allFinished() {
            return f1Finished && f2Finished && f3Finished && f4Finished;
        }
        function one(){
            f1Finished = true;
            if(allFinished())
                five();
        }
        function two(){
            f2Finished = true;
            if(allFinished())
                five();
        }
        function three(){
            f3Finished = true;
            if(allFinished())
                five();
        }
        function four(){
            f4Finished = true;
            if(allFinished())
                five();
        }
        function five(){
            if(!ran5) {
                ran5 = true;
                //...
            }
        }
        one();
        two();
        three();
        four();

Answer 6

我发现很好的文章在Jquery中清除了回调函数的概念。

http://www.impressivewebs.com/callback-functions-javascript/

示例：

function mySandwich(param1, param2, callback) {
alert('Started eating my sandwich.\n\nIt has: ' + param1 + ', ' + param2);
callback();}

mySandwich('ham', 'cheese', function() {
    alert('Finished eating my sandwich.');
});

Answer 7

我就是这样做的

function callFunction(){
    one();
    Await();
    two();
    Await();
    three();
    Await();
    four();
    Await();
    five();
}

function Await(){
for(var i=0;i<100000;i++){
}

}

您还可以微调等待功能

在一个或多个函数完成后调用函数

7 个答案: