JavaScript try/catch/finally
Statement
JavaScript Statement Reference Manual
Example
In the following example, we intentionally misspell a word in the code within the try block.
This example is supposed to alert "Welcome!" but instead shows a spelling error message.
The catch block will catch the error in the try block and execute code to handle it:
try {
adddlert("Welcome!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
More examples are included at the bottom of this article.
Definition and Usage
The try/catch/finally
statement is used to handle errors that may occur in the code.
Errors can be syntax errors, usually caused by coding mistakes or typos by the programmer. They can also be spelling errors or missing features in the language (possibly due to browser differences).
The try statement allows us to define a block of code to be tested for errors while it is being executed.
The catch statement allows us to define a block of code to be executed if an error occurs in the try block.
The finally statement executes after the try and catch blocks, regardless of whether an exception was thrown or caught.
Note: Both catch and finally statements are optional, but you must use at least one when using the try statement.
Tip: When an error occurs, JavaScript will stop execution and generate an error message. Use the throw statement to create custom messages (throw exceptions). When you use throw along with try and catch, you can control the error messages output by the program.
For more about JavaScript errors, see our JavaScript Errors tutorial.
Browser Support
Statement | Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
try/catch/finally | Yes | Yes | Yes | Yes | Yes |
Syntax
Parameter Values
Parameter | Description |
---|---|
tryCode | Required. The block of code to be tested for errors. |
err | Required (if using catch). Specifies a local variable to apply the error to. This variable can reference the Error object (containing the error message, such as "'addlert' is not defined"). If the exception is created by a throw statement, this variable references the object specified in the throw statement (see "More Examples"). |
catchCode | Optional. The block of code to be executed if an error occurs in the try statement. This code will not execute if no error occurs in the try statement. |
finallyCode | Optional. The block of code to be executed regardless of the result of the try/catch statements. |
Technical Details
| JavaScript Version: | 1.4 | | --- | --- |
More Examples
Example
This example checks if the input value is incorrect and throws an exception if it is.
The exception is caught by the catch statement and a custom message is output:
<p>Please enter a number between 5 and 10:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">Test Input</button>
<p id="message"></p>
<script>
function myFunction() {
var message, x;
message = document.getElementById("message");
message.innerHTML = "";
x = document.getElementById("demo").value;
try {
if(x == "") throw "is empty";
if(isNaN(x)) throw "is not a number";
if(x > 10) throw "is too big";
if(x < 5) throw "is too small";
}
catch(err) {
message.innerHTML = "Input value " + err;
}
}
</script>
Example
The finally statement executes regardless of the outcome of the try and catch blocks:
function myFunction() {
var message, x;
message = document.getElementById("message");
message.innerHTML = "";
x = document.getElementById("demo").value;
try {
if(x == "") throw "is empty";
if(isNaN(x)) throw "is not a number";
if(x > 10) throw "is too big";
if(x < 5) throw "is too small";
}
catch(err) {
message.innerHTML = "Input value " + err;
}
finally {
document.getElementById("demo").value = "";
}
}
Related Pages
JavaScript Tutorial: JavaScript Errors
JavaScript Reference Manual: JavaScript throw Statement