JavaScript|錯誤-throw、try、catch、finally

2023-03-13 17:21:33

JavaScript|錯誤-throw、try、catch、finally

1.錯誤

當 JavaScript 引擎執行 JavaScript 代碼時，會發生各種錯誤。可能是文法錯誤，通常是程式員造成的編碼錯誤或錯别字。可能是拼寫錯誤或語言中缺少的功能（可能由于浏覽器差異）。可能是由于來自伺服器或使用者的錯誤輸出而導緻的錯誤。當然，也可能是由于許多其他不可預知的因素。

2.抛出錯誤（throw）

當錯誤發生時，JavaScript引擎通常會停止，并生成一個錯誤。也就是JavaScript抛出一個錯誤。

3.try和catch

try 語句允許我們定義在執行時進行錯誤測試的代碼塊。catch 語句允許我們定義當 try 代碼塊發生錯誤時，所執行的代碼塊。try和catch是成對出現的。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>錯誤</title>
    <script>
        function SayHello(){
            try{
                window.alert("Hello!");
            }catch (error){
                window.alert("出現錯誤：\n" + error + "\n點選确定繼續!\n");
            }
        }
    </script>
</head>
<body>

<input type="button" onclick="SayHello()" value="SayHello!">

</body>
</html>

正常情況下我們點選按鈕會彈出Hello：

JavaScript|錯誤-throw、try、catch、finally

但是如果出現錯誤，例如我們将try中的document.alert改為document.allert：

JavaScript|錯誤-throw、try、catch、finally

就會執行catch的内容提示出現了錯誤，error，即catch的參數用作傳遞錯誤的載體。

4.finally和try、catch、throw的合用

finally 語句不論之前的 try 和 catch 中是否産生異常都會執行該代碼塊。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>錯誤</title>
        <script>
            function getNum(){
                document.getElementById("p").innerHTML = "";    //清空之前的錯誤提示
                var x = document.getElementById("input").value;
                try{
                    // 抛出錯誤
                    if(x === "") throw "輸入為空";
                    else if(isNaN(x)) throw "輸入不是數字";
                    else if(x < 10) throw "輸入小于10";
                    else if(x > 20) throw "輸入大于20";
                }catch (error){
                    document.getElementById("p").innerHTML = "錯誤：" + error; //提示錯誤
                }finally {
                    document.getElementById("input").value = "";    //清空輸入框
                }
            }
        </script>
</head>
<body>
    
請輸入一個10~20的數字：
<input type="text" id="input">
<input type="button" onclick="getNum()" value="确定">
<p id="p"></p>
    
</body>
</html>

JavaScript|錯誤-throw、try、catch、finally

我們輸入一個錯誤的信後後會做出相應的錯誤提示：

JavaScript|錯誤-throw、try、catch、finally

人生沒有白走的路，每一步都算數！

JavaScript|錯誤-throw、try、catch、finally