Reference & Type & Syntax Error

image.jpeg

If you have been writing code more than "Hello World", you might have encountered with errors. It's not a pretty sight when program shows error. As a good developer you must know about error types.

In this blog we will cover three most occurred errors which you might have encountered ReferenceError, TypeError and SyntaxError.

ReferenceError

In JavaScript, reference error occurs when code attempts to reference a non-existing variable.

Examples:

let firstName = "David";
console.log(firstName); 
/* David */ 

console.log(secondName); 
/* ReferenceError: secondName is not defined */

In the above example we tried to reference a variable which is not defined. So JavaScript engine could not find a reference to secondName.

function num() {
    let num = 2;
}

console.log(num);
/* ReferenceError: num is not defined */

In the above example we tried to access variable outside its lexical scope. Outside it's lexical scope JavaScript engine could not reference to num .

console.log(user);
let user = "David";
/* ReferenceError: Cannot access user before its Initialization */

In the above example we tried to access user before it's initialization.

TypeError

In JavaScript, this occurs when we don't pass a expected value to function and because of that operation can not be completed.

Examples:

const user = "David";
user = "John";
/* TypeError: Assignment to constant variable */

In the above example , we tried to change the constant value, but value declared using const cannot be changed.

function Func() {}

const a = Func();
a();
/* TypeError: a is not a function */

In the above example, a is a variable because we are assigning Func() value to a, not declaring a as a function.

function Func() {}

const a = new Func();
Func instanceof a;
/* TypeError: Right-hand side of  instanceof is not callable */

In the above example, when the right hand side operands of the instanceof operator isn't used with a constructor object, TypeError occurs.

function num(a) {
   if(a.length === 5){
      console.log(a);
   }
}

num(null);
/* TypeError: Cannot read 'length' of null */

In the above example, we did not pass an array value which is expected by function num, So JavaScript engine cannot read property length of null.

SyntaxError

JavaScript has set of syntax to right code. When JavaScript engine fails to recognize some syntax of program it throw SyntaxError.

Example:

function hello() {
    console.log("Hello , there");
}
/* SyntaxError: Unexpected end of input */

In the above example, a closing brackets } is missing and even if we miss a parentheses() JavaScript will throw a SyntaxError.

function parent() {
    let a = 3
    for(let i = 0 i < 5; i ++) {
        console.log(a);
   }
}
/* SyntaxError: Unexpected identifier */

In the above example ; is missing in for loop and missing a comma, can throw SyntaxError.

let num = 4;
let num = 6;
console.log(num);
/* SyntaxError: Identifier "num" has already been declared

In above example, we tried to re-declare num, but javascript does not allow to re-declare let variable in same scope, so it will throw SyntaxError.

Conclusion

  • ReferenceError is thrown when we reference non-existing value.

  • TypeError is thrown when use wrong type of value for operation.

  • SyntaxError is thrown when we make a mistake in syntax.