Error handling means detection of errors in the programming. When we are executing javascript code, we may get different types of errors. It can be syntax errors or run time errors.
Syntax errors occur when misspelling of identifiers and keywords, missing double quotes in strings, use of undeclared variables, bad references to objects, improper use of special characters such as mis-matched braces or parenthesis, missing semicolons, error due to wrong input from user or server. It can be also occurred when code cannot compile.
Runtime errors take place when exceptions occurred during execution of the program after compilation. Errors can be occurred because of invalid input data, lack of sufficient memory to run the application or memory conflict with other program, dividing an integer by zero, converting invalid string to number, accessing character that is out of bounds of a string etc.
Using Try/Catch/Finally Statement
We can handle the errors in JavaScript by using Try/Catch/Finally. They are called exception handling statements in JavaScript.
- try statement causes an exception condition and throw an exception.
- catch statement catches the exception thrown by the try block and handles the exception.
- finally statement always executes block of the code.
Syntax of try/catch/finally block
<script type="type/javascript">
try{
//execute the statements
}
Catch(error){
//execute the statements if exception occurs
}
finally{
//block of the code that always execute
}
</script>
JavaScript Error Handling Example
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function myMessage() {
var x = 50, y = 100;
var z = x / y;
try {
if (z < 0.7) {
alert("Number is small");
} else {
alert("Number is big")
}
} catch (error) {
alert("Exception:" + e.description);
} finally {
alert("Finally block always executes!!!");
}
}
</script>
</head>
<body>
<p>Click to see result</p>
<form>
<input type="button" value="Click" onclick="myMessage();" />
</form>
</body>
</html>
- <script type=”text/javascript”> tag is used to define client side script which uses attribute type for specifying MIME type.
- We are using try, catch and finally statements to handle errors in the program.
- try block executes the statements, catch block handles the exception if error occurs and finally block that always executes block of the code.
- <input type=”button” value=”Click” onclick=”myMessage();” /> tag uses button attribute which defines clickable button, value attribute creates click button and onclick() event occurs when user clicks on the element.
JavaScript Error Handling Demo
- Save the file as try_catch_finally_example.html in your system.
- Just open the file in the browser, you will see the below picture in the browser.
When the execution process is completed successfully we will get the following output:
JavaScript – Window Object