javascript

Chapter 14: Error Handling and Debugging
On its surface, this code appears fine: the init() method is called on each module. The problem is that
an error in any module ’ s init() method will cause all modules that come after it in the array to never
be initialized. If the error occurs on the first module, then none of the modules on the page will be
initialized. Logically, this doesn ’ t make sense since each module is an independent entity that isn ’ t
reliant on any other module for its functionality. It ’ s the structure of the code that makes this type of
error fatal. Fortunately, the code can be rewritten as follows to make an error in any one module
nonfatal:
for (var i=0, len=mods.length; i < len; i++){
try {
mods[i].init();
} catch (ex){
//handle error here
}
}
By adding a try - catch statement into the for loop, any error when a module initializes will not
prevent other modules from initializing. When an error occurs in this code, it can be handled
independently and in a way that doesn ’ t interfere with the user experience.
Log Errors to the Server
A common practice in web applications is to have a centralized error log where important errors are
written for tracking purposes. Database and server errors are regularly written to the log and categorized
through some common API. With complex web applications, it ’ s recommended that you also log
JavaScript errors back to the server. The idea is to log the errors into the same system used for server - side
errors and categorize them as having come from the front end. Using the same system allows for the
same analytics to be performed on the data regardless of the error ’ s source.
To set up a JavaScript error - logging system, you ’ ll first need a page or server entry point on the server
that can handle the error data. The page need not do anything more than take data from the query string
and save it to an error log. This page can then be used with code such as the following:
function logError(sev, msg){
var img = new Image();
img.src = “log.php?sev=” + encodeURIComponent(sev) + “ & msg=” +
encodeURIComponent(msg);
}
The logError() function accepts two arguments: a severity and the error message. The severity may be
numbers or strings, depending on the system you ’ re using. An Image object is used to send the request
because of its flexibility, as described here:
❑
❑
The Image object is available in all browsers, even those that don ’ t support the
XMLHttpRequest object.
Cross - domain restrictions don ’ t apply. Often there is one server responsible for handling error
logging from multiple servers, and XMLHttpRequest would not work in that situation.
487