CODEWITHSUNDEEP
javascriptpromisetry-catchsetintervalthrow
YulePale
YulePale

Reputation: 7726

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

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?

Upvotes: 0

Views: 1084

Answers (2)

MinusFour
MinusFour

Reputation: 14423

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);
});

Upvotes: 1

Thomas G. Lopes
Thomas G. Lopes

Reputation: 112

So, you're not catching the error is because code normally runs synchronously, one line at a time. But waitForTimer is an async function, which means it will be called, but run in the background. Anything you want to catch asynchronously needs to be wrapped in an async function or using Promises.

In this case, why is already an async function! So you can do:

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

why()

Or

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

why()

For more info: How do I catch thrown errors with async / await?

Upvotes: 0

Related Questions