Can I extend a JavaScript error? What is the best way to do so?

JavascriptWeb DevelopmentObject Oriented Programming

JavaScript error can be extended by extending the error class. The best way to do this is to create a new custom error class that extends the built in JavaScript error class.

Following is the code for extending errors in JavaScript −


 Live Demo

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   .result {
      font-size: 18px;
      font-weight: 500;
      color: rebeccapurple;
<h1>Extend JavaScript Error</h1>
<div class="result"></div>
<button class="Btn">CLICK HERE</button>
Click on the above button to create a new error by extending the error class
   let resEle = document.querySelector(".result");
   let sampleEle = document.querySelector(".sample");
   let BtnEle = document.querySelector(".Btn");
   class CustomError extends Error {
      constructor(message) {
         super(message); = "Custom Error";
   function test() {
      throw new CustomError("New Error thrown");
   BtnEle.addEventListener("click", () => {
      try {
      catch (err) {
         resEle.innerHTML += " = " + + "<br>";
         resEle.innerHTML += "err.message = " + err.message + "<br>";


The above code will produce the following output −

On clicking the ‘CLICK HERE’ button −

Updated on 17-Jul-2020 08:35:22