本文實(shí)例講述了JS錯(cuò)誤處理與調(diào)試操作。分享給大家供大家參考，具體如下：

JavaScript 錯(cuò)誤 - throw、try 和 catch

try 語句測試代碼塊的錯(cuò)誤。

catch 語句處理錯(cuò)誤。

throw 語句創(chuàng)建自定義錯(cuò)誤。

finally 語句在 try 和 catch 語句之后，無論是否有觸發(fā)異常，該語句都會(huì)執(zhí)行。

JavaScript try 和 catch

try 語句允許我們定義在執(zhí)行時(shí)進(jìn)行錯(cuò)誤測試的代碼塊。

catch 語句允許我們定義當(dāng) try 代碼塊發(fā)生錯(cuò)誤時(shí)，所執(zhí)行的代碼塊。

JavaScript 語句 try 和 catch 是成對出現(xiàn)的。

語法

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

例：

var txt=""; 
function message() 
{ 
  try { 
    adddlert("Welcome guest!"); 
  } catch(err) { 
    txt="本頁有一個(gè)錯(cuò)誤。\n\n"; 
    txt+="錯(cuò)誤描述：" + err.message + "\n\n"; 
    txt+="點(diǎn)擊確定繼續(xù)。\n\n"; 
    alert(txt); 
  } 
}

finally 語句

finally 語句不論之前的 try 和 catch 中是否產(chǎn)生異常都會(huì)執(zhí)行該代碼塊。

<input id="demo" type="text">
<button type="button" οnclick="myFunction()">點(diǎn)我</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 "值不是一個(gè)數(shù)字";
  x = Number(x);
  if(x > 10) throw "太大";
  if(x < 5) throw "太小";
 }
 catch(err) {
  message.innerHTML = "錯(cuò)誤: " + err + ".";
 }
 finally {
  document.getElementById("demo").value = "";
 }
}
</script>

Throw 語句

throw 語句允許我們創(chuàng)建自定義錯(cuò)誤。

正確的技術(shù)術(shù)語是：創(chuàng)建或拋出異常（exception）。

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

語法

throw exception

異?？梢允?JavaScript 字符串、數(shù)字、邏輯值或?qū)ο蟆?/p>

實(shí)例

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

function myFunction() {
  var message, x;
  message = document.getElementById("message");
  message.innerHTML = "";
  x = document.getElementById("demo").value;
  try { 
    if(x == "") throw "值為空";
    if(isNaN(x)) throw "不是數(shù)字";
    x = Number(x);
    if(x < 5)  throw "太小";
    if(x > 10)  throw "太大";
  }
  catch(err) {
    message.innerHTML = "錯(cuò)誤: " + err;
  }
}

JavaScript 調(diào)試工具

在程序代碼中尋找錯(cuò)誤叫做代碼調(diào)試。

調(diào)試很難，但幸運(yùn)的是，很多瀏覽器都內(nèi)置了調(diào)試工具。

內(nèi)置的調(diào)試工具可以開始或關(guān)閉，嚴(yán)重的錯(cuò)誤信息會(huì)發(fā)送給用戶。

有了調(diào)試工具，我們就可以設(shè)置斷點(diǎn) (代碼停止執(zhí)行的位置), 且可以在代碼執(zhí)行時(shí)檢測變量。

瀏覽器啟用調(diào)試工具一般是按下 F12 鍵，并在調(diào)試菜單中選擇 "Console" 。

console.log() 方法

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

實(shí)例

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

設(shè)置斷點(diǎn)

在調(diào)試窗口中，你可以設(shè)置 JavaScript 代碼的斷點(diǎn)。

在每個(gè)斷點(diǎn)上，都會(huì)停止執(zhí)行 JavaScript 代碼，以便于我們檢查 JavaScript 變量的值。

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

debugger 關(guān)鍵字

debugger 關(guān)鍵字用于停止執(zhí)行 JavaScript，并調(diào)用調(diào)試函數(shù)。

這個(gè)關(guān)鍵字與在調(diào)試工具中設(shè)置斷點(diǎn)的效果是一樣的。

如果沒有調(diào)試可用，debugger 語句將無法工作。

開啟 debugger ，代碼在第三行前停止執(zhí)行。

實(shí)例

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

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

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript傳值操作技巧總結(jié)》、《javascript編碼操作技巧總結(jié)》、《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。

最新評(píng)論