Обещание с таймаутом в цикле 'for'

Question

У меня есть несколько функций, которые должны выполняться один за другим в цикле и с задержкой. Вот код, который у меня есть:

function func1() { 
    for (var i = 0; i < 3; i++) { 
    func2().then(); // await in loop until func2() completed  
    } 
} 

function func2() { 
    return new Promise(succes) { 
    for (var i = 0; i < 10; i++) { 
     function3().then(); //wait untill function3 and then continue looping 
    } 
    success(); 
    } 
} 

function function3() { 
    return new Promise(function(ready) { 
    setTimeout(function() { 
     // do some stuff 
     ready(); 
    }, 2000); 
    }); 
} 

Но это не работает. Что я должен изменить?

Answer 1

Я думаю, что вы намеревались использовать это ES8 (в ES2017) async/await конструкция:

async function func1() { 
 
    for (var i = 0; i < 3; i++) { 
 
    console.log(`func1 waiting for func2 #${i + 1}`); 
 
    await func2(); // await in loop until func2() completed 
 
    console.log(`Finished iteration ${i} for func1`); 
 
    } 
 
} 
 

 
async function func2() { 
 
    console.log('Started func2'); 
 
    for (var i = 0; i < 10; i++) { 
 
    console.log(`func2 waiting for func3 #${i + 1}`); 
 
    await function3(); //wait untill function3 and then continue looping 
 
    } 
 
} 
 

 
function function3() { 
 
    return new Promise(resolve => setTimeout(resolve, 1000)); 
 
} 
 

 
func1().then(() => console.log('finished'));

Для более широкой поддержки браузера, вы можете использовать Babel

.

Answer 2

Вы можете использовать jQuery's .each(), это синхронно, поэтому следующий цикл не будет срабатывать до тех пор, пока не закончится предыдущий. Вы также можете добавить обратные вызовы, но здесь они действительно не нужны.

Answer 3

Я не знаю, что это лучшее решение, но это так, и я считаю, что это легко реализовать.

function func1(i){ 
 
    i++; 
 
    return new Promise(function(ready){ 
 
      setTimeout(function(){ 
 
       func2(i); 
 
       ready(i);   
 
      }, 1000); 
 
    }); 
 
} 
 

 
function func2(i = 0){ 
 
    if(i < 10){ 
 
    func1(i).then((test) => { 
 
     console.log(test); 
 
    }) 
 
    } else { 
 
    return false; 
 
    } 
 
} 
 
func2();