JavaScript Error and Handling

Like most of the languages, JavaScript also provide Error handling mechanism. Lets explore this.
Basically JavaScript have seven types of error constructors excluding Error() itself.

image

1. EvalError :This type of error occurs when something wrong happen with JavaScript eval() function.
2.InternalError : This happens when something wrong happen with JavaScript engine itself.
3.RangeError: This is related to variable or parameter is outside of their valid range.
4.ReferenceError : This happens when we try to assign or use a variable which is not declared.
5.SyntaxError : This happens when JavaScript finds syntax problem when it executes eval() method.
6.TypeError: This occurs when a variable or parameter type is not valid.
7.URIError: This occurs when encodeURI() or decodeURI() parameters are invalid.

Error Object creation:-
JavaScript have same type of parameters for creating any type of JavaScript error object.  you can create any JavaScript error using the below syntax:-

new (message,fileName ,lineNumber);

Here all the three parameters are optional.
For example below code is creating just a generic error object.
new Error(“Hello Error”,”myjs.js”,12);

Error Handling:-
For handing error JavaScript provide try catch and finally block. whatever code which you think can produce error should be in try block and when any error occurs , it falls in catch block. The finally block is optional but if you have written finally block then it will be executed irrespective of whether you are coming from try or catch block. Below is a sample code for this.

function ErrorTest () {
    try
    {
        throw new ReferenceError("Trying to use undeclared object","myjs.js",4);
 
    }
    catch(ex)
    {
        console.log(ex.name);
        console.log(ex.message);
        console.log(ex.fileName);
        console.log(ex.lineNumber);
 
    }
    finally
    {
        console.log("finally block called");
 
    }
}
ErrorTest();

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, “Courier New”, courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

and below is the output window for the firefox browser.

image

same code when we run in the Chrome browser then it gives the below output

image

Here you can see that fileName and lineNumber are missing for the Chrome.To fetch these information , you can use error object stack property . This property gives a very descriptive text with all the details of the error in which you can do some string operations to get appropriate information.

image

Hope you find this post useful. Thanks for reading. Happy Coding. 🙂

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s