Error Types in JS

__khojiakbar__

_Khojiakbar_

Posted on June 19, 2024

Error Types in JS

# Most common error types in JS.


1. SyntaxError

What it is:

  • This error occurs when there's a typo or syntax mistake in your code. It's like writing "gibberish" in a sentence.

Examples

Example 1: Missing Parenthesis

// function sayHello(){
    // console.log('Hello World!'
    // SyntaxError: missing ) after argument list
// }
Enter fullscreen mode Exit fullscreen mode

Example 2: Unexpected Token

// a:
// let x = 5;
// let y = 5;
// let result = x * y *;
// Uncaught SyntaxError: Unexpected token ';'

// b:
// let dog = 'bark';
// let cat = 'meaw'
// console.log(dog + cat)!!!
// Uncaught SyntaxError: Unexpected token '!'
Enter fullscreen mode Exit fullscreen mode

Example 3: Missing Comma

// let fruits = ['apple' 'banana', 'cherry']
// console.log(fruits)
// Uncaught SyntaxError: Unexpected string
Enter fullscreen mode Exit fullscreen mode

Example 4: Improper Use of Keywords

// let return = 'Hello World'
// Uncaught SyntaxError: Unexpected token 'return'
Enter fullscreen mode Exit fullscreen mode

Example 5: Unterminated String

// let word = 'Hello World !;
// console.log(word)
// Uncaught SyntaxError: Invalid or unexpected token
Enter fullscreen mode Exit fullscreen mode

Summary

SyntaxError occurs when JavaScript encounters a code structure it doesn't recognize or expects something that isn't there. These errors often involve typos, missing characters, or improper use of reserved keywords. By understanding these common mistakes, you can avoid them and write cleaner, error-free code.


2. ReferenceError

What it is:

  • This error happens when you try to use a variable that hasn't been declared.
  • It's like calling out to someone who isn't there. ## Funny samples

Example 1: Misspelled Variable Name

let cat = 'Kitty'
console.log(kat)
ReferenceError: dog is not defined
Enter fullscreen mode Exit fullscreen mode

Example 2: Using a Variable Before Declaring It

console.log(dinner);
let dinner = 'Cheese';
Uncaught ReferenceError: Cannot access 'dinner' before initialization
Enter fullscreen mode Exit fullscreen mode

Example 3: Calling an Undefined Function

sayHi()  // ReferenceError: sayHi is not defined
Enter fullscreen mode Exit fullscreen mode

Example 4: Accessing a Variable Inside a Block

{
     let myHobby = 'swimming'
 }
 console.log(myHobby);
 Uncaught ReferenceError: myHobby is not defined
Enter fullscreen mode Exit fullscreen mode

Example 5: Function Scope

function stopCar(){
     let text = `Car is stopping...`;
 }
 console.log(text)
 Uncaught ReferenceError: text is not defined
Enter fullscreen mode Exit fullscreen mode

Example 6: Using a Variable Outside Its Block

{
//     let phrase = 'Hey, What\'s up';
// }
// console.log(phrase)
// Uncaught ReferenceError: phrase is not defined
Enter fullscreen mode Exit fullscreen mode

Summary
ReferenceError occurs when JavaScript can't find the variable or function you're trying to use. This usually happens because of typos, using variables before declaring them, or accessing variables outside their scope. By understanding these common mistakes, you can avoid them and write cleaner, error-free code.


3. TypeError

What it is:

  • This error occurs when you try to perform an operation on a value of the wrong type. It's like trying to make a sandwich with a shoe instead of bread.

Example 1. Calling a Non-Function

Scenario: You tried to call something that isn't a function.

let notAFunction = 5;
notAFunction(); // Oops, 'notAFunction' is not a function
Uncaught TypeError: notAFunction is not a function
Enter fullscreen mode Exit fullscreen mode

Example 2. Incorrect Type for Method

  • Scenario: You tried to use an array method on a string.
let text = "hello";
text.push('!'); // Oops, 'text' is not an array
Uncaught TypeError: text.push is not a function
Enter fullscreen mode Exit fullscreen mode

Example 3: Non-iterable Spread

  • Scenario: You tried to use the spread operator on a non-iterable value.
let notIterable = 123;
let array = [...notIterable]; // Oops, 'notIterable' is not iterable
Uncaught TypeError: notIterable is not iterable
Enter fullscreen mode Exit fullscreen mode

Example 4: Invalid Assignment

  • Scenario: You tried to assign a value to a non-variable.
(10 + 5) = 15; // Oops, can't assign to an expression
Uncaught TypeError: Invalid left-hand side in assignment
Enter fullscreen mode Exit fullscreen mode

Example 4: Object as Function

  • Scenario: You tried to call an object as if it were a function.
let castle = { name: "Camelot" };
castle(); // Oops, 'castle' is not a function
Uncaught TypeError: castle is not a function
Enter fullscreen mode Exit fullscreen mode

TypeError occurs when you perform an operation on a value of the wrong type. Common causes include calling non-functions, accessing properties of undefined or null, using methods on incorrect object types, attempting to modify read-only or frozen properties, passing incorrect argument types, and misusing constructors.


4. RangeError

What is it?

  • A RangeError in JavaScript is an error that occurs when a value is not within the set or expected range. This type of error usually happens when a numeric value is outside the permissible range of values. Let's break down some common scenarios where RangeError might occur.

Examples

Example 1: Invalid Array Length

  • Scenario: You tried to create an array with an invalid length.
let array = new Array(-5); // Oops, array length can't be negative
Uncaught RangeError: Invalid array length
Enter fullscreen mode Exit fullscreen mode

Example 2: Maximum Call Stack Size Exceeded

  • Scenario: You hit the recursion limit by calling a function too many times.
function endlessLoop() {
  console.log("Still going...");
  endlessLoop(); // Oops, infinite loop
}

endlessLoop();
Uncaught RangeError: Maximum call stack size exceeded
Enter fullscreen mode Exit fullscreen mode

Example 3: toFixed() Argument Range

  • Scenario: You tried to use the toFixed() method with an out-of-range argument.
let num = 123.456;
num.toFixed(101); // Oops, too many decimal places
Uncaught RangeError: toFixed() digits argument must be between 0 and 100
Enter fullscreen mode Exit fullscreen mode

Example 4: Invalid Date

  • Scenario: You tried to create a date with an invalid date string.
let timeTravel = new Date("32/13/2020"); // Oops, impossible date
console.log(timeTravel);
Invalid Date
Enter fullscreen mode Exit fullscreen mode

Summary

RangeError occurs when you use a number that is outside of its allowable range in JavaScript. Common causes include creating arrays or buffers with invalid lengths, exceeding recursion limits, using out-of-range arguments in methods like toFixed() or toPrecision(), accessing data views with out-of-bounds indices, passing too many arguments to functions, and creating dates with invalid strings.

💖 💪 🙅 🚩
__khojiakbar__
_Khojiakbar_

Posted on June 19, 2024

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related