Is there any way I could catch any uncaught exception in javascript? I mean, all my "dangerous" code are in try-catch blocks. But what about exceptions that I don't handle explicitly? I'm using jQuery, my main javascript file starts with :

$(document).ready(function(){})

here I bind some events to some DOM elements. I can use try-catch blocks here, but they will catch exceptions that occur during the event binding procedure, not during the event handling. But if I used try-catch blocks in every event handling functions it would be ugly.

How should I catch exceptions that don't occur in my explicit try-catch blocks? (I don't want to write a general handler function, I just want to send the problem to my server)

Is there any way I could catch any uncaught exception in javascript? I mean, all my "dangerous" code are in try-catch blocks. But what about exceptions that I don't handle explicitly? I'm using jQuery, my main javascript file starts with :

$(document).ready(function(){})

here I bind some events to some DOM elements. I can use try-catch blocks here, but they will catch exceptions that occur during the event binding procedure, not during the event handling. But if I used try-catch blocks in every event handling functions it would be ugly.

How should I catch exceptions that don't occur in my explicit try-catch blocks? (I don't want to write a general handler function, I just want to send the problem to my server)

• javascript
• jquery
• exception

3 Answers 3

You could write a function that would wrap your real handlers in a try/catch

function tc(func, msg) {
  msg = msg || "Handler exception";
  return function(e) {
    try {
      return func(e);
    }
    catch (exc) {
      $.post( /* send exception to server? */ );
      throw exc; // let nature take its course
    }
  };
}

(Might want to get fancier with argument handling etc.) Then when you bind handlers you'd do:

$('#whatever').click(tc(function(e) {
  // your handler function
}, "This is the message sent to the server when this handler fails"));

Also, if you want to make sure "this" in the handler behaves as before, you can do func.apply($(this), e) instead of just func(e).

You can use the window.onerror event handler, it's not supported in Opera though and it may not fire in certain situations (thanks @Josh).

It's not really wise to do this, however, it will make bug finding a nightmare for a start. It's generally best to make sure your code is error free in the first place :-) You certainly shouldn't need to use try... catch statements very often in JavaScript and you definitely shouldn't be using empty catch blocks.

I can use try-catch blocks here, but they will caught exceptions that occured during the event binding procedure, not during the event handling.

You can also add try/catch blocks to inner scopes:

// Outer
try { 
    $(document).ready(function(){})
}
catch (e) {
    /* Error handling */
}

// Inner
$(document).ready(function(){
    try { /* ... */ } catch (e) { /* Error handling */ }
});

How about

    function func_madness() {
        throw("This function is throwing exceptions, because \n" +
        "it can not throw polar bears and whales.\n");
    } // func_madness

    window.onload = function () {
        try {
            func_madness();
        } catch (err) {
            document.write("Caught it!\n<br/>\n" + err);
        } // catch
    } // window.onload