How to have a function calling sequentially other functions and emitting events?

Question

I don't know if this is duplicate, but I was not able to find an answer.

I am developing a Typescript library for a web application. I need a function f that would need to sequentially call other functions and emit events to be listened by the caller.

Pseudocode:

function f(arg1, arg2, arg3) {
    const r1 = b()
    // wait for b execution
    emit('phase1', r1)
    const r2 = c()
    // wait for c execution
    emit('phase2', r2)
    const r3 = d()
    // wait for d execution
    emit('phase3', r3)
}
f('1', 3, '4').once('phase1', doSomething).once('phase3', somethingElse)

Using async/await would permit me to sequentially execute the inner functions, but in that case f would need to return a Promise, thus losing the possibility to emit events. If I choose to return an event emitter I would lose in readability since inner functions could not be awaited sequentially.

I have found this interesting library Promievent, inspired by web3, but, since I think this is a not so rare application, I was wondering if there's a better approach/pattern to use.

Answer 1

How about a Generator function which yields events? e.g.

function* f() {
    const r1 = b()
    yield ['phase1', r1]
    const r2 = c()
    yield ['phase2', r2]
}

Answer 2

As already suggested by Josh Bothun one could choose an approach based on generator functions and generators.

Since from what can be seen from the OP's provided pseudo code implementation of function f(arg1, arg2, arg3) { /* ... */ }, the asynchronous functions/methods might get provided as parameters to such a function. And since one needs to await the result of each function call one has to go for an async generator approach which makes the OP's original f an asynchronous to be implemented function as well.

And as for the OP's concerns ...

"... but in that case f would need to return a [p]romise, thus losing the possibility to emit events"

... of cause one can always emit/trigger/dispatch events from any asyn function. And the promise in witch such a function is wrapped/embedded into does neither always need to return a meaningful value nor does it always need to be handled (here e.g. by await ... see also the (unhandled) final invocation of the below provided async implementation).

// an async function and event type generator-function.
async function* createAsyncFunctionAndEventTypeIterable(asyncFunctions) {
  let asyncFct;
  while (asyncFct = asyncFunctions.shift()) {

    yield (await asyncFct());
  }
}

// the OP's function which needs to be implemented as async.
async function awaitAndEmitOneAfterTheOther(...asyncFunctions) {
  // asyncFunctions = asyncFunctions.flat();

  const asyncIterable =
    createAsyncFunctionAndEventTypeIterable(asyncFunctions);

  for await (const [type, value] of asyncIterable) {
    emit(type, value);
  }
}


// test setup

// the event emitter mock.
function emit(type, value) {
  console.log('emit ...', { type, value });
}
function createAsyncTestFunctionAndEventType(delay, type, value) {
  return async function () {
    return await (
      new Promise(resolve => setTimeout(resolve, delay, [type, value]))
    );
  }
}
const [
  asyncFct_1,
  asyncFct_2,
  asyncFct_3,
] = [
  [2000, 'phase1', 'foo'], [1000, 'phase2', 'bar'], [3000, 'phase3', 'baz'],
].map(([delay, type, value]) =>
  createAsyncTestFunctionAndEventType(delay, type, value)
);

// execute test.
console.log('... test started ...');

awaitAndEmitOneAfterTheOther(asyncFct_1, asyncFct_2, asyncFct_3);

.as-console-wrapper { min-height: 100%!important; top: 0; }