How to throw an error inside a setInterval that is inside a function that is inside a try block?

Question

Consider the code below:

async function why(){
    try {
        function noWait(callback) {
            callback();
        }
        async function waitForTimer(callback) {
            var timer = setInterval(()=>{
              clearInterval(timer);
              callback()
            }, 10);
        }
        waitForTimer(()=>{
            throw "this is error??"
        });
        noWait(()=>{
            throw"this is error!!"
        });
    } catch (err) {
        console.log(err);
    }
}

why()

How can I throw errors inside the setInterval function and get the caught in the catch block? The error thrown in the noWait() callback works but in the waitForTimer() callback does not, why is this so?

Answer 1

It throws an error but it is not being caught correctly (because the error is not being thrown within the try block). One alternative is to try and catch in your callback.

function why() {
  function noWait(callback) {
    try {
      callback();
    } catch (e) {
      //error here
    }
  }

  function waitForTimer(callback) {
    var timer = setInterval(() => {
      try {
        clearInterval(timer);
        callback()
      } catch (e) {
        //caught error here
      }
    }, 10);
  }
  waitForTimer(() => {
    throw "this is error??"
  });
  noWait(() => {
    throw "this is error!!"
  });
}

But of course this is pretty bad.

setInterval can be kind of tricky with builtin async features. It's not a good fit for Promise since you could resolve/reject multiple times. Possible alternatives would be to use an Event Emitter, use an Observable library (like RxJS) or maybe even writing an async iterator.

In this example since you are using setInterval as a setTimeout basically... you can just wrap it into a promise.

let timeout = ms => new Promise(res => setTimeout(res, ms));
async waitForTimer function(){
    await timeout(10);
    callback();
}

Then you can catch it if you await waitForTimer:

let timeout = ms => new Promise(res => setTimeout(res, ms));
async function why() {
  try {
    function noWait(callback) {
      callback();
    }
    async function waitForTimer(callback) {
      await timeout(10);
      callback();
    }
    await waitForTimer(() => {
      throw "this is error??"
    });
    noWait(() => {
      throw "this is error!!"
    });
  } catch (err) {
    console.log(err);
  }
}

why()

You can still catch the other like you do (you just won't caught both unless you move them into separate try blocks).

The timeout function can also be written with setInterval if you wish but it's kind of unnecessary.

let timeout = ms => new Promise(res => {
    let timer = setInterval(() => {
        clearInterval(timer);
        res();
    }, ms);
});