Do you know about JavaScript errors that could happen?

Fizer Khan -

A JavaScript bug may cause issues with your web applications and web sites. There are seven types of errors in JavaScript.

  1. SyntaxError
  2. ReferenceError
  3. RangeError
  4. TypeError
  5. URIError
  6. InternalError
  7. EvalError

In the above list, first 5 error types are the most common ones. We will see when these errors
will occur and the example code snippets which raise specific errors that you can directly
try in your browser's developer console.

SyntaxError

The SyntaxError is raised when trying to interpret a syntactically invalid code.

Examples

var 1fafd;

(or)

for (i > 0; i++) {}

(or)

if (true) console.log('hello')

ReferenceError

The ReferenceError is raised when a non-existent variable is referenced.
For instance, when you are trying to access the variable or function which is not
declared, then you will get reference error.

Examples

console.log(myName)

(or)

var object = {};
object[key]

RangeError

The RangeError is raised when a value is not in the set or range of allowed values.
For instance, when creating an array with an illegal length,
or when passing invalid values to the numeric methods such as Number.toExponential(),
Number.toFixed(), or Number.toPrecision(). Both Number.toExponential() and Number.toFixed()
accept arguments from 0 to 20, while Number.toPrecision()'s expected range is
from 1 to 21 inclusive.

Examples

new Array(-1)

(or)

11..toFixed(53580)

(or)

var num = 10.4553;
num.toPrecision(22);

TypeError

The TypeError is raised when a value is not of the expected type. For instance,
if you try to access a non-existent function in the object, or instantiation(new keyword)
of number or boolean value, then TypeError will be thrown.

Examples

"prop" in true.

(or)

var obj = {}
obj.perform()

(or)

var str = '';
str.toFixed()

(or)

new 100

URIError

The URIError is raised when a global URI handling function is used in a wrong way.
A URIError is thrown by the encodeURI(), decodeURI(), encodeURIComponent(),
decodeURIComponent(), escape() and unescape() URI handling functions when
they are passed a malformed URI.

Examples

decodeURIComponent("%")

decodeURI('%')

InternalError

InternalError occurs when an internal error in the JavaScript engine is thrown.
E.g. "too much recursion".

Examples

function foo() {
  foo();
}
foo();

EvalError

An EvalError is thrown when the global eval() function is used improperly.
But this exception is not currently used within ES5 specification.
This object remains for compatibility with previous editions of this specification.
So this error can't be produced in modern browsers.

Final Thoughts

Fixing Javascript errors is critical to the effectiveness of all web applications and web sites. You need to provide best user experience to your visitors/users.

At Atatus, we provide live front-end contextual error tracking for web applications and sites. With Browser Monitoring, you can easily track all the front-end errors and resolve them within a matter of minutes.

It offers features such as:

  • Core Web Vitals
  • Single Page Application monitoring
  • AJAX monitoring
  • Error Tracking
  • User Journeys

If you haven’t signed up yet, try out the free 14 day trial – no credit card required. If you have any questions, we’d love to hear from you.