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

Javascript Web Development Object 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 −

Example

Live Demo

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