Raising The Bar - JavaScript

Wondering why JavaScript doesn't include exception-handling constructs like its bigger cousins? Well, the newest version of JavaScript does - and this article tells you all about it, explaining how you can use the new Error object and the "try-catch" constructs to trap and resolve errors in script execution.

TABLE OF CONTENTS:

By: icarus, (c) Melonfire

Poor Best

Rating:

/ 239

August 14, 2003

print this article

SEARCH DEV SHED

TOOLS YOU CAN USE

This is accomplished via JavaScript's "throw" statement, which is used to raise errors which can be detected and resolved by the "try" family of exception handlers. The "throw" statement needs to be passed an error type. When the exception is raised, this exception name and description will be made available to the defined exception handler.

Let's go to a quick example. In the following piece of code, if the value entered into the form field is greater than 99, the code will manually generate a RangeError exception, which will be caught and displayed appropriately.


<html>

<head>

<script language="JavaScript">
function checkAge()

{

try {

// if incorrect value in form

// generate an error

if (document.forms[0].age.value > 99)

{

throw RangeError;

}

} catch (e) {

// catch all thrown errors and print error type

alert(e.name); 

}

}
</script>

</head>
<body>
<form>

<input type="text" name="age" onBlur="checkAge()">

</form>
</body>

</html>

You can also create your own exceptions, via the JavaScript Error constructor. The following example demonstrates, by creating a custom error type called idiotUserError.

In this case, when you run the script, a new Error object will be created named idiotUserError, with the message specified in the Error object constructor. This error can now be thrown using the regular "throw" statement, as in the example above.

Let's try a more useful example:


<html>

<head>

<script language="JavaScript">
// create new Error objects

badNameError = new Error ("System user name does not match actual user 
name"); noNameError = new Error ("System user name cannot be blank");
// create generic exception handler

// to display error message

// you may want to filter down error types

// further inside this and handle each type

// differently

function mainExceptionHandler(e)

{

alert (e.message);

}
// general form validation functions

function validateForm()

{

checkName();

}
// check form values

// if errors, throw appropriate exception

function checkName()

{

try {

if (document.forms[0].username.value == "")

{

throw noNameError;

}
 if (document.forms[0].username.value != "john")

{

throw badNameError;

}

} catch (e) {

// any and all errors will go to this handler

mainExceptionHandler(e);

} 

}
</script>

</head>
<body>
<form onSubmit="validateForm()">

Enter your system username: <input type="text" name="username"> 
<br> <input type="submit" name="submit" value="Go"> 
</form>
</body>

</html>

In this case, if the value entered into the form is blank or not "john", a custom exception will be thrown by the code. This custom exception can be caught by a generic exception handler such as the one used above, and the exception can be routed and resolved appropriately

Next: Endzone >>



	>>> More JavaScript Articles >>> More By icarus, (c) Melonfire

blog comments powered by Disqus

JAVASCRIPT ARTICLES

- Introduction to JavaScript
- Adding Elements to a Tree with TreeView jQue...
- Using the Persist Argument in a TreeView jQu...
- Using Unique and Toggle in a TreeView jQuery...
- Using Event Delegation for Mouseover Events ...
- Using the Animate Option in a Treeview jQuer...
- Using HTML Lists with Event Delegation in Ja...
- Opened and Closed Branches on a TreeView jQu...
- Mouseover Events and Event Delegation in Jav...
- Creating a TreeView JQuery Hierarchical Navi...
- Event Delegation in JavaScript
- A Look at the New YUI Carousel Control
- Working with Draggable Elements and Transpar...
- Displaying Pinned Handles with Resizable Con...
- Building Resizable Containers with the Ext J...

Find More JavaScript Articles

DevShed

JavaScript Tutorials

Raising The Bar - JavaScript

See Also:

Dev Shed Tutorial Topics: