如何在 JavaScript 中使用 try...catch...finally 语句?
每当我们编写代码时,我们的代码中都可能出现不必要的异常(错误),如语法错误、引用错误或范围错误。我们可以使用 try 和 catch 块来处理这些错误。
在本教程中,我们将学习在 JavaScript 中使用 try…catch…finally 语句。try-catch 和 finally 语句用于处理异常(错误)。我们将学习如何在 JavaScript 中处理异常或错误。
错误处理 在操作来自其他机构的数据或用户输入时多次使用。
我们有四个关键字来处理错误。 (i) try (ii) catch (iii) throw (iv) finally。
try 语句将测试代码块是否存在错误
catch 语句将处理错误。
throw 语句允许您创建自定义错误。
finally 语句将在 try 和 catch 之后执行。
首先,我们将了解 JavaScript 中的错误类型。
JavaScript 中的错误类型
ReferenceError − 当我们未在代码中定义变量时,会发生这种类型的错误。
RangeError −当数字超出可接受的值范围时,会发生这种类型的错误。
SyntaxError − 当我们在代码中使用不正确的语法时,会发生这种类型的错误。
语法
在执行 try 块时,如果发生任何错误,则将由 catch 块处理。
try { //try 语句 } catch (exception) { //catch 语句 }
让我们看看 try-catch 的示例。
示例
在此示例中,我们将仅使用 try and catch 块,并了解如何引用由 catch 块处理的错误。我们将取两个变量,一个是 ‘a’,另一个是 ‘b’。首先,我们将打印 ‘a’ 和 ‘b’ 的总和。然后我们尝试找到变量 ‘a’ 和 ‘c’ 的总和(其中 ‘c’ 未定义)。
<html> <head> <title>Use of try, catch and finally in JavaScript</title> </head> <body> <h2>Use of try, catch and finally in JavaScript</h2> <h4>Variable is not defined, so an error occurs.</h4> <p id="div1"> </p> <p id="div2"> </p> <script> let Div1 = document.getElementById("div1"); let Div2 = document.getElementById("div2"); var a = 2; var b = 3; try { Div1.innerHTML = `sum of a and b is: ${a+b}`; a + c; } catch (error) { Div2.innerHTML = error; } </script> </body> </html>
在上面的例子中,我们可以看到在 try 语句块中我们定义了变量"a"和"b",但变量"c"未定义。因此,当执行 a+c 的求和时,会发生引用错误,并且此错误由 catch 块处理。
当 try 块中发生错误时,其余指令将不会执行 try 块。
如果我们在代码中不使用 try-catch 块,则整个程序在发生错误时会终止。
将 finally 块与 try-catch 一起使用
finally 语句将在 try 和 catch 块之后执行。 finally 不依赖于 try 或 catch 块,因此 无论 try-catch 块是否执行,它都会始终执行。
语法
try { //try 语句 } catch (exception) { //catch 语句 } finally { //finally 语句 }
示例
在前面的代码中,我们将 finally 块添加到代码中并了解它将如何执行。在这里,我们将使用 finally 块打印变量 ‘a’ 和 ‘b’ 的值。
<html> <head> <title> Example - Use of try, catch and finally in JavaScript </title> </head> <body> <h2> Use of try, catch and finally in JavaScript </h2> <h4> finally block is executed after try and catch block. </h4> <p id="div1"> </p> <p id="div2"> </p> <p id="div3"> </p> <p id="div4"> </p> <script> let Div1 = document.getElementById("div1"); let Div2 = document.getElementById("div2"); let Div3 = document.getElementById("div3"); let Div4 = document.getElementById("div4"); var a = 2; var b = 3; try { Div1.innerHTML = "sum of a and b is: " + `${a+b}`; a + c; } catch (error) { Div2.innerHTML = error; } finally { Div3.innerHTML = "value of a is: " + a; Div4.innerHTML = "value of b is: " + b; } </script> </body> </html>
在上面的例子中,当我们在代码中添加 finally 块时,我们得到了变量"a"和"b"的值。我们可以看到 finally 块在 try 和 catch 块之后执行。
结论
我们通过示例学习了如何在 JavaScript 中使用 try-catch-finally。通过使用 try-catch 语句,我们可以在代码执行期间处理不必要的错误。如果我们不使用 try-catch,当发生错误时,我们的程序会停止执行,但通过使用 try-catch,我们可以捕获并处理这些错误。最后,无论是否有错误,该块都用于在 try-catch 之后运行指令。