Loading Please Wait...
There may be situations, when JavaScript code failed to execute (run) due to error and bugs.
There errors can be of any kind such as incorrect spelling, wrong input, and others.
// the below code cause error because of "a" is not defined
let c = a + 10;
alert(c);
JavaScript provide try, catch, finally, and throw keyword (statements) to handle error.
The try statement allows you to define a block of code to be tested for errors while it is being executed.
The catch statement allows you to define a block of code to be executed, if an error occurs in the try block.
The JavaScript statements try and catch come in pairs.
The finally statement lets you execute code, after try and catch, regardless of the result. It is optional and can be omitted.
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
finally {
Optional Block of code to be executed regardless of the try / catch result
}
try {
let c = a + 10;
alert("c is: " + c);
}
catch(error) {
alert(error);
}
// With finally
try {
let c = a + 10;
alert("c is: " + c);
}
catch(error) {
alert(error);
}
finally {
alert('Execution Finished');
}
When an error occurs, JavaScript will normally stop and generate an error message.
The technical term for this is: JavaScript will throw an exception (throw an error).
JavaScript will actually create an Error object with two properties: name and message.
The throw statement allows you to create a custom error.
Technically you can throw an exception (throw an error).
The exception can be a JavaScript String, a Number, a Boolean or an Object.
If you use throw together with try and catch, you can control program flow and generate custom error messages.
<!DOCTYPE html>
<html>
<body>
Square of: <input id="num" type="text"> = <span id="result"></span>
<br>
<button type="button" onclick="calSquare()">Calculate</button>
<script>
function calSquare() {
let result = document.getElementById("result");
result.innerHTML = "";
let num = document.getElementById("num").value;
try {
if(num.trim() == "") throw "Empty Value";
if(isNaN(num)) throw "Not a number";
x = parseInt(num);
result.innerHTML = num*num;
}
catch(err) {
result.innerHTML = err;
}
}
</script>
</body>
</html>
JavaScript has a built in error object that provides error information when an error occurs.
The error object provides two useful properties: name and message.
name: Sets or returns an error name
message: Sets or returns an error message (a string)
Error name property returns Six different values:
Name | Description |
---|---|
EvalError | An error has occurred in the eval() function |
RangeError | A number "out of range" has occurred |
ReferenceError | An illegal reference has occurred |
SyntaxError | A syntax error has occurred |
TypeError | A type error has occurred |
URIError | An error in encodeURI() has occurred |
An EvalError indicates an error in the eval() function.
Newer versions of JavaScript do not throw EvalError. Use SyntaxError instead.
An RangeError is thrown if you use a number that is outside the range of legal values.
let num = 10;
try {
num.toPrecision(500);
}
catch(err) {
alert(err.name);
alert(err.message);
}
An ReferenceError is thrown if you use (reference) a variable that has not been declared.
try {
let c = a + 10;
}
catch(err) {
alert(err.name);
alert(err.message);
}
An SyntaxError is thrown if you try to evaluate code with a syntax error.
try {
eval("alert('Lynxsia)");
}
catch(err) {
alert(err.name);
alert(err.message);
}
An TypeError is thrown if you use a value that is outside the range of expected types.
try {
let num = 10;
num.toUpperCase();
}
catch(err) {
alert(err.name);
alert(err.message);
}
An URIError is thrown if you use illegal characters in a URI function.
try {
decodeURI("%%%");
}
catch(err) {
alert(err.name);
alert(err.message);
}
Mozilla and Microsoft define some non-standard error object properties.
Do not use these properties in public web sites. They will not work in all browsers.
How you feel about this blog:
Share this blog on:
If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com
Contact UsWe are concern with various development process like website design & development, E-commerce development, Software development, Application development, SMS & Bulk SMS Provider, PWA Development, and many more..
Copyright ©
, Lynxsia IT Solutions, All rights reserved