Debugging JavaScript: Handling Runtime Exceptions / Page 2

Debugging JavaScript: Handling Runtime Exceptions [con't]

A variation of error swallowing is to display a generic error for anything that goes wrong:

function parseString(str) { try { var result = functionA(str); result = functionB(result); result = functionC(result); } catch(e) { alert('An error occurred. Sorry.'); } return result; }

Now the problem is that the error is so generic as to be of no benefit for the client or developer.

Use Error Types to Create More Meaningful Messages

There are six core Error classes in JavaScript that extend the Error object.

EvalError:

Occurs within the eval() function.

RangeError:

Occurs when a numeric variable or parameter is outside of its valid range.

ReferenceError:

Occurs when de-referencing an invalid reference.

SyntaxError:

Occurs while parsing code.

TypeError:

Occurs when a variable or parameter is not of a valid type.

URIError:

Occurs when encodeURI() or decodeURI() are passed invalid parameters.

An easy way to set an error message is to use a switch statement:

try { foo.bar(); } catch (e) { switch (true) { case (e instanceof EvalError): alert("An Eval Error occurred: " + e.message); break; case (e instanceof RangeError): alert("A RangeError occurred: " + e.message); break; //etc... case default: alert("A generic error occurred: " + e.message); break; } }

Error Properties

As in all things JavaScript, there are some error properties that are supported by all major browsers, while others are vendor specific. Here is the list of available error properties:

Standard Properties

constructor: Specifies the function that created an instance's prototype.

message: Error message.

name: One of the six Error classes outlined above, or simply "Error".

Vendor-specific Extensions

Microsoft:

description: Error description. Similar to message.

number: Error number.

Mozilla:

fileName: Path to file that raised this error.

lineNumber: Line number in file that raised this error.

stack: Stack trace.

The following code creates a customized error message using a combination of error properties:

try { foo.bar(); } catch (e) { alert( "An error occurred! " + (e.number || e.name ) + ": " + (e.description || e.message) ); }

Throwing Your Own Errors

The throw statement gives you the ability to create custom exceptions in order to generate even more specific and detailed error messages. In addition to Errors, the throw statement works with strings, integers, booleans or just about any object type. Here's a function that validates an age against minimum and maximum values and throws an appropriate error if it fails. Regardless of the results, it always returns success or failure:

function validateAge(minAge, maxAge, age) { var result = true; //we're optimistic! try { if (isNaN(parseInt(age))) throw new TypeError("The age parameter must be a number."); else if (age maxAge) throw new RangeError("The age supplied is invalid."); } catch(e) { alert(e.name + ": " + e.message); result = false; } finally { return result; } }

Adding Custom Properties to Your Errors

Having the ability to throw objects gives us the advantage of being able to define our own properties and methods. In this example, the error is really an object literal. It would be easy to imagine how the error handling code could use the htmlMessage to insert a link in the document using the DOM:

throw { name: "System Error", level: "Show Stopper", message: "Error detected. Please contact the system administrator.", htmlMessage: "Error detected. Please contact the <a href="mailto:sysadmin@acme-widgets.com">system administrator</a>." }

While perhaps not on par with some full-fledged programming languages, JavaScript's error handling is making great strides. Next time, we'll examine some ways to make very thorough debugging statements as well as examine some tools that can assist us in JavaScript development.

---

Rob Gravelle combined his love of programming and music to become a software guru and accomplished guitar player. He created systems that are used by Canada Border Services, CSIS and other Intelligence-related organizations. As a software consultant, Rob has developed Web applications for many businesses and recently created a MooTools version of PHPFreechat for ViziMetrics. Musically, Rob recently embarked on a solo music career, after playing with Ivory Knight since 2000. That band was rated as one Canada's top bands by Brave Words magazine (issue #92) and released two CDs. Rob's latest, entitled KNIGHTFALL, was a collaboration between himself, the former Ivory Knight vocalist, and legendary guitarist/producer, Jeff Waters of Annihilator fame. Rob is available for short-term software projects and recording session work. to inquire, but note that, due to the volume of emails received, he cannot respond to every email. Potential jobs and praise receive highest priority!

Original: April 27, 2009

Find a programming school near you

Zip Code:

Subject: - Select All Subjects - Computer Applications Computer Engineering Computer Science Computer Prog. - Software Dev. Computer Game Programming Web Design Web Development Internet Systems Internet Certification Database Design and Development Information Systems Management Information Technology Project Management Network Design - Development Systems Analyst

Degree: - Select All Degrees - Associate's Bachelor's Master's Doctoral Certificates Diplomas Coursework MBA

Online Campus Both