JavaScript 錯誤處理

執(zhí)行JavaScript代碼時，可能會發(fā)生意想不到的錯誤。

錯誤可以是程序員編寫的編碼錯誤，由于輸入錯誤引起的錯誤以及其他不可預(yù)見的事情。

因此，為了處理錯誤，JavaScript提供了4個關(guān)鍵字：

• try語句使您可以測試代碼塊是否存在錯誤

• catch語句可讓您處理錯誤

• throw語句可讓您創(chuàng)建自定義錯誤

• finally語句使您可以在嘗試并捕獲之后執(zhí)行代碼，而不管結(jié)果如何

在此示例中，我們將“alert”寫為“aaalert”來故意產(chǎn)生錯誤：

try {
aaalert("Hello world");
} catch(e) {
document.getElementById("result").innerHTML = e.name + "<br>" + e.message;
}

發(fā)生錯誤時，JavaScript通常會停止運行，并創(chuàng)建一個具有兩個屬性的Error對象：name和message。

JavaScript try ... catch語句

try語句允許您定義一個代碼塊，該代碼塊在執(zhí)行時將進行錯誤測試。

catch如果try塊中發(fā)生錯誤，則該語句允許您定義要執(zhí)行的代碼塊。

JavaScript語句try和catch成對出現(xiàn)：

try {
  //try_statements-嘗試嘗試的語句
}catch（err）{
  //catch_statements-處理錯誤的語句
}

JavaScript throw語句

throw語句引發(fā)用戶定義的異常。

throw語句允許您創(chuàng)建自定義錯誤。從技術(shù)上講，這稱為“引發(fā)異常 ”。

異?？梢允荍avaScript字符串，數(shù)字，布爾值或?qū)ο螅?/p>

  throw "Invalid";  // 生成帶有字符串值的異常
  throw 32;   // 生成值為32的異常
  throw true;   // 生成值為true的異常

如果throw與try和一起使用catch，則可以指定程序流程并生成自定義錯誤消息。

在此示例中，如果傳遞任何非數(shù)字參數(shù)，則getRectArea()將引發(fā)自定義錯誤：

function getRectArea(width, height) {
   if (isNaN(width) || isNaN(height)) {
  throw "Parameter is not a number!";
   }
}

try {
   getRectArea(5, 'Z');
}
catch(err) {
   document.getElementById('para').innerHTML = err;
}

輸入驗證示例

在此示例中，如果值錯誤，則引發(fā)異常（err）。catch語句捕獲異常（err），并顯示自定義錯誤消息：

var x = document.querySelector("input").value;
try {
   if(x == "")  throw "is Empty";
   if(isNaN(x)) throw "Not a Number";
   if(x > 10)   throw "too High";
   if(x < 5)throw "too Low";
}
catch(err) {
   document.getElementById("para").innerHTML = "Input " + err;
}

JavaScript 最終語句

該finally語句使您可以在try和之后執(zhí)行代碼，而catch不管結(jié)果如何。

try {
   aaalert("Hello world");
}
catch(err) {
   document.getElementById("result").innerHTML = err;
}
finally {
   document.getElementById("result").innerHTML += "<h3>Finally statement executed</h3>";
}

catch和finally語句都是可選的，但你需要使用其中之一（如果不是兩個），而使用try語句：

try {
   aaalert("Hello world");
}
finally {
   document.getElementById("result").innerHTML = "Finally statement executed";
}

JavaScript錯誤對象

JavaScript具有一個內(nèi)置的Error對象，該對象在發(fā)生錯誤時提供錯誤信息。

錯誤對象提供了兩個有用的屬性：name和message。

錯誤對象屬性

下表列出了Error對象的屬性：

錯誤類型

error name屬性可以返回七個不同的值：

下一節(jié)將更詳細地介紹這些錯誤類型中的每一個。

EvalError

當(dāng)通過eval()函數(shù)執(zhí)行代碼期間發(fā)生錯誤時，將拋出一個EvalError。

但是，JavaScript不再拋出此錯誤，但是仍然保留此對象是為了向后兼容。

較新版本的JavaScript不會拋出異常EvalError。使用SyntaxError代替。

RangeError

當(dāng)使用超出允許值范圍的數(shù)字時，將引發(fā)RangeError。

例如，創(chuàng)建長度為負數(shù)的數(shù)組將拋出RangeError：

try {
var arr = new Array(-1); // throws a range error
} catch(err) {
document.getElementById("result").innerHTML = err.name + "<br>" + err.message;
}

ReferenceError

當(dāng)您試圖引用或訪問一個不存在的變量或?qū)ο髸r，通常會拋出一個ReferenceError。

try {
var x = 5 + y; // 拋出引用錯誤
} catch(err) {
document.getElementById("result").innerHTML = err.name + "<br>" + err.message;
}

SyntaxError

如果您的JavaScript代碼中有任何語法問題，則會在運行時引發(fā)SyntaxError。

try {
eval("alert('Hello)");   // Missing ' will throw an error
} catch(err) {
document.getElementById("result").innerHTML = err.name + "<br>" + err.message;
}

TypeError

當(dāng)值不是期望的類型時，拋出TypeError。

var num = 50;
try {
num.toUpperCase();   // 您不能將數(shù)字轉(zhuǎn)換為大寫
} catch(err) {
document.getElementById("result").innerHTML = err.name + "<br>" + err.message;
}

URIError

當(dāng)您指定無效的URI（統(tǒng)一資源標(biāo)識符）時，將引發(fā)URIError。

try {
decodeURI("%");   // You cannot URI decode percent sign
} catch(err) {
document.getElementById("result").innerHTML = err.name + "<br>" + err.message;
}

完整的錯誤參考

有關(guān)完整的屬性和方法參考，請訪問我們的JavaScript錯誤參考。

參考部分包含所有Error屬性和類型的描述和示例。