Go to lewagon.com

Understanding JavaScript error types

Navigate through JavaScript errors like a pro! Discover key error types, understand their causes, and learn effective resolution strategies. Level up your coding game with expert insights.
JavaScript error types
Summary

What is an error in JavaScript?

In JavaScript, an error is an object that represents an exceptional condition that occurs during the execution of your code. These errors halt the normal flow of execution and can potentially disrupt the intended functionality of your program. In other words, it’s what happens when something in your code breaks.

 

Key aspects of a JavaScript error

1. Creation: 

Errors are typically created using the built-in Error constructor. You can optionally provide a message argument to describe the nature of the error. Additionally, JavaScript packages might generate their own error objects for certain internal issues.

new Error("My error message");

2. Properties: 

When you see an error message, it may show you some of the following elements:

  • name: A string specifying the error type (e.g., “TypeError”, “ReferenceError”).
  • message: A string containing a human-readable description of the error.
  • stack: A string containing the call stack (a trace of function calls leading to the error).

 

3. Throwing and Catching: 

Throwing:

To raise an error is fairly simple:

throw new Error(“My error”)

This line of code will raise a new error message.

 

Catching:

What if you’re getting an error message that you want to ignore, instead of having it stop your code? That’s when we use try/catch in JS.

Imagine I tried running nonExistentFunction(). I should get an error, since I never actually defined that function, right?

But what if I do:

try {

  nonExistentFunction();

} catch (e) {

  console.log(e);

  // Expected output: ReferenceError: nonExistentFunction is not defined

  // (Note: the exact output may be browser-dependent)

}

console.log(“Continuing on anyway”)

 

Then I will see the error message in the console, since I said console.log(error). But I will also see “Continuing on anyway”, since my code continues executing.

So, catch/try allows us to “handle” errors, to do something other than stopping code execution. This technique is commonly used when dealing with API requests, which may not always come back with exactly the same response we want, for example.

 

4. Debugging: 

Understanding and effectively debugging JavaScript errors is crucial for writing robust and reliable code. Utilizing browser developer tools, proper error handling techniques, and a clear understanding of error messages can significantly improve your development workflow.

Our immersive developer bootcamp will equip you with the in-demand skills and practical knowledge needed to thrive in the ever-evolving world of web development. You’ll learn the fundamentals of JavaScript, delve into its various frameworks and libraries, and gain hands-on experience building real-world projects. Boost Your Career with JavaScript Expertise: Join Our Web Developer Bootcamp!

 

Discover the main types of errors in Javascript

From syntax mishaps to runtime exceptions, navigating through JavaScript errors is an essential skill for developers seeking to build reliable and resilient applications. Understanding the types, meanings, and resolutions of JavaScript errors is paramount for developers to effectively diagnose, troubleshoot, and rectify issues in their code. ​​Here are the main types of errors in JavaScript:

 

1. Syntax Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError

Syntax errors occur when the JavaScript engine encounters code that violates the language’s syntax rules. These errors prevent the code from being parsed and executed. Examples include missing semicolons, mismatched parentheses, or misspelled keywords.

javascript

// Syntax Error Examples

console.log(“Hello, world!” // Missing closing parenthesis

 

2. Reference Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors 

Reference errors occur when trying to access a variable or function that is not declared or is out of scope. This typically happens when referencing variables that do not exist or have not been defined within the current scope.

javascript

// Reference Error Example

console.log(foo); // ‘foo’ is not defined

 

3. Type Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypeError 

Type errors occur when attempting to perform an operation on a value of an inappropriate type. This can happen when trying to call a non-existent function, accessing properties of undefined or null values, or using incorrect types in operations.

javascript

// Type Error Example

var num = 10;

num(); // num is not a function

 

4. Range Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RangeError 

Range errors occur when using a value that is outside the acceptable range. This commonly occurs with methods like parseInt() when providing values that are too large or too small.

javascript

// Range Error Example

var array = new Array(-1); // Invalid array length

 

5. URI Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError 

URI errors occur when there is a problem with encoding or decoding Uniform Resource Identifiers (URIs). This can happen when using methods like decodeURI() or encodeURI() incorrectly.

javascript

// URI Error Example

decodeURI(‘%’); // URI malformed

 

6. Eval Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/EvalError 

Eval errors occur when an error occurs during the execution of code via the eval() function. This can happen when evaluating code that contains syntax errors.

javascript

// Eval Error Example

eval(“alert(‘Hello world!)”); // Missing closing single quote

 

7. Internal Errors

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/InternalError 

Internal errors are rare and indicate a critical issue within the JavaScript engine itself. These errors are typically not caused by the developer’s code but by issues within the engine implementation.

 

8. DOM Exceptions

https://developer.mozilla.org/en-US/docs/Web/API/DOMException 

DOM exceptions occur when there is an abnormal condition that occurs with Document Object Model (DOM) operations. These exceptions often relate to issues with manipulating the DOM, such as attempting to access elements that do not exist or trying to perform operations on elements that are not accessible.

 

9. Network Errors

https://developer.mozilla.org/en-US/docs/Web/API/DOMException#networkerror 

Network errors occur when there are problems with network operations, such as making HTTP requests. These errors can occur due to network connectivity issues, server unavailability, or timeouts.

 

Understanding these types of errors and knowing how to handle them appropriately is crucial for writing robust and reliable JavaScript code. Developers should employ techniques like error handling, debugging, and testing to detect and address errors effectively.

 

Our users have also consulted:
Pour développe mes compétences
Formation développeur web
Formation data scientist
Formation data analyst
Les internautes ont également consulté :
Le Wagon Talks: Life at a Chinese Tech Giant

On August 5th, 2020, Le Wagon Talks was joined by Jamey Silveira, a Senior Strategist

Alumni Stories: the entrepreneurs of Le Wagon Tokyo, vol. 1

After a little over 2 years operating in Japan, we are extremely proud to introduce

Suscribe to our newsletter

Receive a monthly newsletter with personalized tech tips.