Loading Please Wait...

Logo Lynxsia IT Solutions

JavaScript Errors

JS Error

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);
        
      
Error Handling

JavaScript provide try, catch, finally, and throw keyword (statements) to handle error.

Try, Catch And Finally

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.

Syntax
					 
        
          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');
          }
        
      
JavaScript Throws Errors

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

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>
        
      
The Error Object

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 Values

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
Eval Error

An EvalError indicates an error in the eval() function.

Newer versions of JavaScript do not throw EvalError. Use SyntaxError instead.

Range Error

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);
          }
        
      
Reference Error

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);
          }
        
      
Syntax Error

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);
          }
        
      
Type Error

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);
          }
        
      
URI (Uniform Resource Identifier) Error

An URIError is thrown if you use illegal characters in a URI function.

					 
        
          try {
            decodeURI("%%%"); 
          }
          catch(err) {
            alert(err.name);
            alert(err.message);
          }
        
      
Non-Standard Error Object Properties

Mozilla and Microsoft define some non-standard error object properties.

  • fileName (Mozilla)
  • lineNumber (Mozilla)
  • columnNumber (Mozilla)
  • stack (Mozilla)
  • description (Microsoft)
  • number (Microsoft)

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:

Report Us

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 Us
Ads
Logo
Lynxsia IT Solutions

We 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..

Kotwali Road, Chhiptehri, Banda, 210001, UP, India

Copyright © 2022, Lynxsia IT Solutions, All rights reserved