JS событий в серии и параллельно

Question

У меня есть набор событий, каждое из которых запускается со своим таймером. У меня есть несколько вариантов использования, но для простоты, скажем, они для отдельных анимационных событий. Некоторые события выполняются в течение определенного c промежутка времени, а некоторые - для определенного числа итераций.

Я хочу вызывать события в последовательности, используя обратные вызовы, так что я могу быть уверен, что предыдущая задача была завершена раньше это начинает следующий. Добавлять анимацию. Я также хочу, чтобы можно было передавать параметры задачам, чтобы я мог контролировать скорость, например. Я хотел бы получить что-то вроде:

runSequence( task1(10, 3,"test"), task5(3,7), task3())

Примечание: каждая функция task () имеет свой собственный таймер setInterval (), который выполняет действие.

Так что я могу запустить группу задач в Последовательность в порядке моего выбора, каждая задача ждет завершения предыдущего, прежде чем начать. Я также мог бы инициировать другую последовательность задач, например, через 1 секунду, которая будет выполняться параллельно с первой последовательностью.

runSequence( task1(10, 3,"test"), task5(3,7), task3())
wait(1000) // the previous sequence is still running even after this wait period.
runSequence (task2(), task4(5,7)). //these tasks happen in order

Я не уверен, как этого добиться. Возможно, мне удастся придумать что-то, что работает, но не может быть элегантным или наилучшим практическим способом сделать это.

Заранее благодарен за любой совет!

Answer 1

То, что вы хотите, - это создавать функции, которые возвращают функции, которые возвращают обещания. Asyn c обещает функции возврата, так что это может быть ответ, который вы ищете:

Давайте начнем с task1(10, 3,"test"):

function task1(duration, distance, elementId) {
    return async () => {
        // do some logic here with your arguments, setting animations going
        // if you want to do it dirty, just await the duration argument
        await new Promise(resolve => setTimeout(resolve, duration));
    }
}

Теперь, если у вас есть много таких структурированных функций аналогично вышесказанному - функции, которые возвращают функции, которые возвращают обещания, - тогда вы готовы приступить к определению вашей функции runSequence

Что-то вроде этого:

async function runSequence(sequence) {
    const results = [];
    for (let func of sequence) {
        const result = await func();
        results.push(result);
    }
    return results;
}

, которая затем позволит вам что-то сделать как

runSequence([task1(10, 3,"test"), task1(50, 2,"test2"), task1(15, 15,"test3")])

Каждая задача, переданная в runSequence, будет происходить по порядку, но можно сделать два отдельных вызова runSequence, чтобы сделать две отдельные последовательности одновременно.