Different ways to handle JavaScript errors

try and cath

Example

<p id = "demo"></p>
<script>
try {
addAlert("hellow guest!");
}
catch(err){
document.getElementById("demo").innerHTML = err.message;
}
</script>

EvalError

EvalError()

Example

try {
throw new EvalError('Hello', 'someFile.js', 10);
} catch (e) {
console.log(e instanceof EvalError);
console.log(e.message);
console.log(e.name);
console.log(e.fileName);
console.log(e.lineNumber);
console.log(e.columnNumber);
console.log(e.stack);
}

InternalError

InternalError()

Example

function loop(x) {
if (x >= 10) // "x >= 10" is the exit condition
return;
// do stuff
loop(x + 1); // the recursive call
}
loop(0);

RangeError

Example

var num = 1;
try {
num.toPercision(500);
}
catch(err){
document.getElementById("demo").innerHTML = err.name;
}

Type Error

Example

var num = 1;
try {
num.toUpperCase();
}
catch(err){
document.getElementById("demo").innerHTML = err.name;
}

URI(Uniform Resource Identifier) Error

Example

try {
decodeURI("%%%");
}
catch(err){
document.getElementById("demo").innerHTML = err.name;
}

SyntaxError

SyntaxError()

Example

try {
eval('hoo bar');
} catch (e) {
console.error(e instanceof SyntaxError);
console.error(e.message);
console.error(e.name);
console.error(e.fileName);
console.error(e.lineNumber);
console.error(e.columnNumber);
console.error(e.stack);
}

ReferenceError

ReferenceError()
try {
let a = undefinedVariable
} catch (e) {
console.log(e instanceof ReferenceError)
console.log(e.message)
console.log(e.name)
console.log(e.fileName)
console.log(e.lineNumber)
console.log(e.columnNumber)
console.log(e.stack)
}

switch statement

Example

switch (expression) {
case label_1:
statements_1
[break;]
case label_2:
statements_2
[break;]

default:
statements_def
[break;]
}

Utilizing Error objects

Example

function doSomethingErrorProne() {
if (ourCodeMakesAMistake()) {
throw (new Error('The message'));
} else {
doSomethingToGetAJavascriptError();
}
}

try {
doSomethingErrorProne();
} catch (e) { // NOW, we actually use `console.error()`
console.error(e.name); // logs 'Error'
console.error(e.message); // logs 'The message', or a JavaScript error message
}

--

--

--

React Frontend Developer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

JavaScript Event bubbling and delegation

Art of debugging with Chrome DevTools

Implementing page object model using protractor and typescript

Angular 13: Server Side Form Validations in Ant Design

Class & Functional components in React

A beginner’s guide to understanding React’s context API

Understanding Scope and Closures in Javascript

State Management With Redux — React Native

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Tanvir Shakil

Tanvir Shakil

React Frontend Developer

More from Medium

JavaScript: Deep Dive into Functions - Part 2

Using Closures To Capture and Modify Primitive Variables in JavaScript

What is Javascript

Delving into Developing: Intro to JavaScript Complex Data Types