Easy Tutorial
❮ Prop Datetime Readonly Event Onpagehide ❯

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

❮ Prop Datetime Readonly Event Onpagehide ❯