JS錯誤處理與調試操作實例分析

本文實例講述了JS錯誤處理與調試操作。分享給大家供大家參考，具體如下：

JavaScript 錯誤 - throw、try 和 catch

try 語句測試代碼塊的錯誤。

catch 語句處理錯誤。

throw 語句創建自定義錯誤。

finally 語句在 try 和 catch 語句之后，無論是否有觸發異常，該語句都會執行。

JavaScript try 和 catch

try 語句允許我們定義在執行時進行錯誤測試的代碼塊。

catch 語句允許我們定義當 try 代碼塊發生錯誤時，所執行的代碼塊。

JavaScript 語句 try 和 catch 是成對出現的。

語法

try { ... //異常的拋出 } catch(e) { ... //異常的捕獲與處理 } finally { ... //結束處理 }

例：

var txt=''; function message() { try { adddlert('Welcome guest!'); } catch(err) { txt='本頁有一個錯誤。nn'; txt+='錯誤描述：' + err.message + 'nn'; txt+='點擊確定繼續。nn'; alert(txt); } }

finally 語句

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

<input type='text'><button type='button' οnclick='myFunction()'>點我</button><p id='p01'></p><script>function myFunction() { var message, x; message = document.getElementById('p01'); message.innerHTML = ''; x = document.getElementById('demo').value; try { if(x == '') throw '值是空的'; if(isNaN(x)) throw '值不是一個數字'; x = Number(x); if(x > 10) throw '太大'; if(x < 5) throw '太小'; } catch(err) { message.innerHTML = '錯誤: ' + err + '.'; } finally { document.getElementById('demo').value = ''; }}</script>

Throw 語句

throw 語句允許我們創建自定義錯誤。

正確的技術術語是：創建或拋出異常（exception）。

如果把 throw 與 try 和 catch 一起使用，那么您能夠控制程序流，并生成自定義的錯誤消息。

語法

throw exception

異?？梢允?JavaScript 字符串、數字、邏輯值或對象。

實例

本例檢測輸入變量的值。如果值是錯誤的，會拋出一個異常（錯誤）。catch 會捕捉到這個錯誤，并顯示一段自定義的錯誤消息：

function myFunction() { var message, x; message = document.getElementById('message'); message.innerHTML = ''; 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; }}

JavaScript 調試工具

在程序代碼中尋找錯誤叫做代碼調試。

調試很難，但幸運的是，很多瀏覽器都內置了調試工具。

內置的調試工具可以開始或關閉，嚴重的錯誤信息會發送給用戶。

有了調試工具，我們就可以設置斷點 (代碼停止執行的位置), 且可以在代碼執行時檢測變量。

瀏覽器啟用調試工具一般是按下 F12 鍵，并在調試菜單中選擇 'Console' 。

console.log() 方法

如果瀏覽器支持調試，你可以使用 console.log() 方法在調試窗口上打印 JavaScript 值：

實例

a = 5;b = 6;c = a + b;console.log(c);

設置斷點

在調試窗口中，你可以設置 JavaScript 代碼的斷點。

在每個斷點上，都會停止執行 JavaScript 代碼，以便于我們檢查 JavaScript 變量的值。

在檢查完畢后，可以重新執行代碼（如播放按鈕）。

debugger 關鍵字

debugger 關鍵字用于停止執行 JavaScript，并調用調試函數。

這個關鍵字與在調試工具中設置斷點的效果是一樣的。

如果沒有調試可用，debugger 語句將無法工作。

開啟 debugger ，代碼在第三行前停止執行。

實例

var x = 15 * 5; debugger; document.getElementbyId('demo').innerHTML = x;

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關于JavaScript相關內容感興趣的讀者可查看本站專題：《JavaScript錯誤與調試技巧總結》、《JavaScript傳值操作技巧總結》、《javascript編碼操作技巧總結》、《JavaScript中json操作技巧總結》、《JavaScript切換特效與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript動畫特效與技巧匯總》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程序設計有所幫助。