Javascript Error Handling

JavaScript has two basic levels of error handling: syntax errors and runtime errors.

Javascript Syntax Errors

In Javascript, syntax errors occur when code interpret before it start execution.

Javascript Syntax Errors Example

//Missing opening { curly bracket
for(var i=0; i<10; i++)
	// do stuff here
}

//Missing semi colon
var counter = 0
var total = 10

//Expected '('
for(var i=0; i<10; i++){
	statement;
}

//Expected identifier
alert(Person.Address);
alert(counter);

//Expected 'catch'
try{
statement;
}

//Can't have 'break' outside of loop
for(var i=0; i<10; i++;){
	statement;
}
break;

Javascript Runtime Errors

Runtime errors also known as exception occur due to an illegal operation during execution of Javascript code.

Javascript Javascript Runtime Errors Example

//Object doesn't support this property or method
alert(Person.Address);

//Function expected
alert(displayAllFields());

//Object expected
Person.prototype.address = "12-13-276"

// expected identifier
var for;

Try...Catch...Finally & Throw

In Javascript, the most comman way to handle runtime errors is try..catch...finally statement. The try...catch...finally statement provides a way to handle all of the errors that may occur in a given block of code, while still running code. If errors not handled by the code, JavaScript provides the default error message. Try...Catch...Finally statement can be used to capture two types of errors: runtime errors and user errors.

Syntax

try{
//block of code...
}
catch(error){
// error handling code
}
finally {
    // finallyStatements
}

Try - block contains code that throw error or excetion.
Catch - block contains code that handle errors.
Finally - block is always run unless an unhandled error occurs.

Javascript Try...Catch Example

<html>
<head>
<script type="text/javascript">
try{
	//Invoking undefined method here
	undefindeMethod();
	document.write('This will not execute.');
}
catch(error){
	document.write ("Error Message: " + error.message);
	document.write ("</br>");
	document.write ("Error Name: " + error.name);
}
</script>
</head>
<body>
</body>
</html>

In the above example the "undefindeMethod()" method not defined and script os trying to invoke the method in catch block. Code in catch block is throwing error or exception, thus document.write statement will not execte here. Catch block will execute here to handle the error or exception thrown by catch block.

Above example will produce following result

Error Message: 'undefindeMethod' is not defined
Error Name: ReferenceError

Javascript Try...Catch...Finally Example

<html>
<head>
<script type="text/javascript">
try{
	//Commented undefined method here
	//undefindeMethod();
	document.write('No execption occure, this will execute.');
}
catch(error){
	document.write ("Error Message: " + error.message);
	document.write ("Error Name: " + error.name);
}
finally
{
document.write('This will execute.');
}
</script>
</head>
<body>
</body>
</html>

In the above example if you can see the "undefindeMethod()" method has been commented in the catch block. Code in catch block is not throwing any error or exception, thus document.write statement will execte. Because no exception occure in try block, the catch block won't execute.

Above example will produce following result

No execption occure, this will execute.
This will execute.