Javascript 简明教程
JavaScript - Extending Errors
JavaScript 中的 custom 错误是你自己创建的错误,与 JavaScript 抛出的内置错误相反。你可以创建自定义错误来处理代码中可能出现的特定类型的错误。
要创建 custom error ,可以使用 Error 构造函数。Error 构造函数采用一个字符串作为其参数,该字符串将成为错误消息。
Extending the Error Class: Creating Custom Errors
创建自定义错误的最佳方法是创建一个新类并使用“extends”关键字进行扩展。它使用了继承的概念,并且自定义错误类继承了 Error 类的属性。
在 constructor() 函数中,你可以初始化自定义错误类的属性。
Syntax
你可以按照下面的语法通过扩展 Error 类来创建自定义错误。
class customError extends Error {
constructor(message) {
super(message)
// Initialize properties
}
}
在上面的代码中,我们使用 super() 方法调用父类构造函数。
你也可以在构造函数中初始化 customError 类的属性。
Example
在下面的代码中,我们从用户处获取输入。当用户单击检查年龄按钮时,它会调用 checkAge() 函数。
我们在 JavaScript 代码中定义了 ageError 类,并使用 Error 类对其进行了扩展。在 ageError 类中,我们添加了 constructor() 函数来初始化属性。
在 constructor() 函数中,我们使用 super() 方法来初始化 Error 类的 message 属性。此外,我们还在构造函数中初始化了“name”和“age”属性。
在 checkAge() 函数中,如果年龄小于 18 岁,则抛出错误,在 catch{} 块中,我们打印错误消息和年龄。
<html>
<body>
<p>Enter your age: <input type = "number" id = "age" /> </p>
<button onclick = "checkAge()"> Check Age </button>
<p id = "demo"> </p>
<script>
const output = document.getElementById("demo");
class ageError extends Error {
constructor(message, age) {
super(message);
this.name = "ageError";
this.age = age // Custom property
}
}
function checkAge() {
const ageValue = document.getElementById('age').value;
try {
if (ageValue < 18) { // Throw error when age is less than 18
throw new ageError("You are too young", ageValue);
} else {
output.innerHTML = "You are old enough";
}
} catch (e) {
output.innerHTML = "Error: " + e.message + ". <br>";
output.innerHTML += "Age: " + e.age + "<br>";
}
}
</script>
</body>
</html>
Output
Enter your age: 5
Check Age
Error: You are too young.
Age: 5
如果你想为自定义错误创建多个新类,只是为了提供明确的错误类型和消息,而不想要改变 Error 类的属性,可以使用以下语法。
class InputError extends Error {};
让我们通过下面的示例学习它。
Example
在下面的代码中,我们创建了 3 个不同的自定义类,并使用 Error 类对其进行了扩展,以创建自定义错误。
在 try{} 块中,我们抛出 StringError。
在 catch{} 块中,我们使用 instanceOf 运算符来检查错误对象的类型,并相应地打印错误消息。
<html>
<body>
<div id = "demo"> </div>
<script>
const output = document.getElementById("demo");
class StringError extends Error { };
class NumberError extends Error { };
class BooleanError extends Error { };
try {
throw new StringError("This is a string error");
} catch (e) {
if (e instanceof StringError) {
output.innerHTML = "String Error";
} else if (e instanceof NumberError) {
output.innerHTML = "Number Error";
} else if (e instanceof BooleanError) {
output.innerHTML = "Boolean Error";
} else {
output.innerHTML = "Unknown Error";
}
}
</script>
</body>
</html>
Multilevel Inheritance
你可以通过继承 Error 类来创建一个通用的自定义错误。之后,你可以扩展自定义错误类来创建一个更通用的错误类。
让我们通过以下示例了解它。
Example
在下面的代码中,我们定义了 'NotFound' 类,并使用 Error 类扩展它。
之后,我们定义了 'propertyNotFound' 和 'valueNotFound' 类,并使用 'NotFound' 类扩展它们。在这里,我们执行了多重继承。
在 try 块中,如果数组不包含 6,我们抛出 valueNotFound 错误。
在 catch 块中,我们打印错误。
<html>
<body>
<div id = "output"> </div>
<script>
const output = document.getElementById("output");
class NotFound extends Error {
constructor(message) {
super(message);
this.name = "NotFound";
}
}
// Further Inheritance
class propertyNotFound extends NotFound {
constructor(message) {
super(message);
this.name = "propertyNotFound";
}
}
// Further Inheritance
class ElementNotFound extends NotFound {
constructor(message) {
super(message);
this.name = "ElementNotFound";
}
}
try {
let arr = [1, 2, 3, 4, 5];
// Throw an error if array doesn't contain 6
if (!arr.includes(6)) {
throw new propertyNotFound("Array doesn't contain 6");
}
} catch (e) {
output.innerHTML = e.name + ": " + e.message;
}
</script>
</body>
</html>