JavaScript 错误 - 抛出并尝试捕获

JavaScript 提供了对程序处理过程中的错误异常的处理机制,通过 try...catch 语句捕获错误并根据实际业务处理错误。

JavaScript 提供了对程序处理过程中的错误异常的处理机制,通过 try...catch 语句捕获错误并根据实际业务处理错误。

JavaScript 提供了 2 个语句用于错误/异常的处理:

  • throw 语句允许您抛出自定义错误。
  • try...catch...finally 语句让你对可能出现错误的代码自定义捕获错误后的处理方式。finally 代码段则不管是否有错误都会执行,它是可选的。

错误会发生!

执行 JavaScript 代码时,可能会发生不同的错误。

错误可能是程序员造成的编码错误、错误输入导致的错误以及其他不可预见的事情。

在此示例中,我们将“alert”拼错为“adddlert”以故意产生错误:

<p id="demo"></p>

<script>
  try {
    adddlert("Welcome guest!");
  } catch (err) {
    document.getElementById("demo").innerHTML = err.message;
  }
</script>

JavaScript 将addlert作为错误捕获,并将错误显示在页面上。

try…catch…finally 语法

try {
  // 这里是可能发生错误的代码
} catch (_err_) {
  // 捕获错误后的处理方式
} finally {
  // 不管是否有错误,这里的代码都执行
}

try 包围的代码块是可能发生错误的代码块。

catch 中的代码是如果 try 块中发生了错误后要执行的代码块。

finally 块则是不管是否有错误,这里的代码都执行。

trycatch 成对出现,finally 是可选的。

抛出错误 throw

throw (抛出)是一个技术术语,用以表述发生错误后,系统处理错误的动作。发生错误后,系统会停止并抛出一个错误,或者抛出一个异常。

一旦发生错误,系统会抛出一个错误对象 Error。 Error 对象包含有描述错误信息的 message 属性。

我们可以通过 throw 语句可以抛出自定义的错误。

可抛出的异常可以是一个字符串、一个数字、一个布尔值、一个对象,甚至是其他任意对象。

throw "Too big"; // throw a text
throw 500; // throw a number

结合使用 throwtry...catch ,则可以控制程序流程并生成自定义错误消息。

下面例子通过 throwtry...catch 控制输入,并给出输入提示。

<!DOCTYPE html>
<html>
  <body>
    <p>请输入 5 到 10 之间的数字:</p>

    <input id="demo" type="text" />
    <button type="button" onclick="myFunction()">输入测试</button>
    <p id="p01"></p>

    <script>
      function myFunction() {
        const message = document.getElementById("p01");
        message.innerHTML = "";
        let x = document.getElementById("demo").value;
        try {
          if (x == "") throw "空";
          if (isNaN(x)) throw "不是数字";
          x = Number(x);
          if (x < 5) throw "值太小";
          if (x > 10) throw "值太大";
        } catch (err) {
          message.innerHTML = "输入:" + err;
        } finally {
          document.getElementById("demo").value = "";
        }
      }
    </script>
  </body>
</html>

错误对象

JavaScript 有一个内置的错误对象,它在发生错误时提供错误信息。

错误对象提供了两个有用的属性: namemessage

属性 说明
name 设置或返回错误名称
message 设置或返回错误信息(字符串)

常用的错误类型

除了 Error 对象,JavaScript 还定义了几个常用的错误类型。

错误类型 说明
EvalError eval() 函数发生错误
RangeError 出现了“超出范围”的数字
ReferenceError 发生了非法引用
SyntaxError 出现语法错误
TypeError 发生了类型错误
URIError encodeURI() 中发生错误
AggregateError 当操作需要报告多个错误时,创建一个表示包含在单个错误中的多个错误的实例。例如通过 Promise.any() 产生的错误。