在 JavaScript 中，finally 的作用是什么？

在 JavaScript 中，finally 是一个代码块或语句，在使用 try 和 catch 块处理错误时，无论如何都会执行。这些 JavaScript 中的 try、catch 和 finally 块将执行可能出错并可能导致程序行为异常（突然终止）的代码。

这个 finally 块位于 try 和 catch 块之后，如果 try 或 catch 块中的任何一个被执行，它都一定会被执行。finally 块允许我们定义必须执行的操作，而不管某些代码成功或失败。

  • 在 JavaScript 中进行错误处理时，try 块是必须的，而 catch 和 finally 是可选的。

  • 这三个块可以组合使用，例如 try 与 catch 和 finally 同时使用，或者 try 块与另外两个块中的任何一个块一起使用。

  • try 可以不带任何块使用。但是，要使用 finally，则必须使用 try 块。

语法

这是 JavaScript 中 finally() 块以及 try 和 catch 块的语法：

try{
   //The code where the chances of error can be predicted 
}
catch{
   //The code which will be executed if try block is executed
}
finally{
   //The code which will be definitely executed after the try and catch blocks.
}

try 块中提到的错误主要是由于一些运行时问题和程序员造成的错误。程序的执行顺序如下。

首先，执行 try 块中的代码，如果发生任何错误，则编译器会搜索 catch 块，如果存在 catch 块，则执行其中的内容。

然后，执行 finally 块。下面将通过示例说明 finally 及其他 try 和 catch 块的实现。

示例 1

此示例演示了 try 和 catch 同时使用时 finally 块的执行：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
   <h2> Finally - JavaScript</h2>
   <button type="button" onclick="forFinally()"> Click the button to show the result </button>
   <p id="try"> </p>
   <p id="catch"> </p>
   <p id="finally"> </p>
   <script type="text/javascript">
      function forFinally() {
         try {
            document.getElementById("try").innerHTML = " Try block is executed ";
         } 
         catch (error) {
            document.getElementById("catch").innerHTML = " Catch block is executed additional Information: " + error;
         } 
         finally {
            document.getElementById("finally").innerHTML = "Finally block is executed ";
         }
      }
   </script>
</body>
</html>

执行上述程序后，将显示一个按钮。

单击它将显示 try 和 catch 执行的结果。

示例 2

以下是 try、catch 和 finally 的另一个示例：

<!DOCTYPE html>
<html>
<body>
   <h2>Finally - JavaScript</h2>
   <p>Please input a number between 5 and 10:</p>
   <input id="demo" type="text">
   <button type="button" onclick="tryFinally()">Test Input</button>
   <p id="try"></p>
   <p id="message"></p>
   <script>
      function tryFinally() {
         const message = document.getElementById("message");
         message.innerHTML = "";
         let x = document.getElementById("demo").value;
         try {
            if(x == "") document.getElementById("try").innerHTML = "Please provide the specific input as mentioned";
            if(isNaN(x)) document.getElementById("try").innerHTML = "Its is Not a Number";
            if(x > 10) document.getElementById("try").innerHTML = "Input is greater than 10";
            if(x < 5) document.getElementById("try").innerHTML = "Given input is less than 5";
            if(x>5 && x<10) document.getElementById("try").innerHTML = "Given input is as required";
         }
         finally{
            message.innerHTML = "This is the finally block executed after the try block"
         }
      }
   </script>
</body>
</html>

执行上述程序后，将显示一个文本框和一个按钮，要求输入 5 到 10 之间的数字。

  • 如果输入相同的数字（5 到 7 之间的数字），则会显示一条成功消息“输入符合要求”。

  • 如果输入的值大于 10，则消息为“输入大于 10”。

  • 同样，如果输入的值小于 5，则输出消息为“输入小于 5”。

在所有情况下，finally 都会在 try 块之后执行，显示“这是 try 块执行后执行的 finally 块”。

更新时间： 2022年8月25日

954 次浏览

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告