大家好，我是前端進階者。

創(chuàng)新互聯(lián)建站技術(shù)團隊十年來致力于為客戶提供做網(wǎng)站、網(wǎng)站設(shè)計、品牌網(wǎng)站設(shè)計、全網(wǎng)整合營銷推廣、搜索引擎SEO優(yōu)化等服務(wù)。經(jīng)過多年發(fā)展，公司擁有經(jīng)驗豐富的技術(shù)團隊，先后服務(wù)、推廣了數(shù)千家網(wǎng)站，包括各類中小企業(yè)、企事單位、高校等機構(gòu)單位。

執(zhí)行JavaScript代碼時，可能會發(fā)生意想不到的錯誤。錯誤可以是程序員編寫的編碼錯誤，由于輸入錯誤引起的錯誤以及其他不可預(yù)見的事情。

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

一、JavaScript try ... catch語句

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

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

 
 
 
 

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

完整代碼：

例中，將“alert”寫為“aaalert”來故意產(chǎn)生錯誤。

 
 
 
 

  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
JavaScript Error
 
  
  
  
  
 
  
  
  
  
將" alert"寫為" aaalert"來故意產(chǎn)生錯誤：
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
  
  
  
  
 
 
 
 
 

將" alert"寫為" aaalert"來故意產(chǎn)生錯誤：

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

二、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ā)自定義錯誤：

1. 輸入驗證

如果值錯誤，則引發(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 錯誤對象

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

四、錯誤類型

1. EvalError

當(dāng)通過eval()函數(shù)執(zhí)行代碼期間發(fā)生錯誤時，將拋出一個EvalError。但是，JavaScript不再拋出此錯誤，但是仍然保留此對象是為了向后兼容。

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

2. RangeError

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

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

 
 
 
 

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

3. ReferenceError

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

 
 
 
 

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

4. SyntaxError

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

 
 
 
 

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

5. TypeError

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

 
 
 
 

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

6. URIError

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

五、總結(jié)

本文基于JavaScript ，介紹了常見的錯誤處理。對于每一種錯誤語句都做了詳細(xì)的分析，對于JavaScript 錯誤對象中需要注意的點。在實際操作中，遇到的難點提供了相對于的解決方法。希望能夠幫助讀者在遇到錯誤時 更好的調(diào)試，處理。

代碼很簡單，希望能夠幫助你更好的學(xué)習(xí)。

本文轉(zhuǎn)載自微信公眾號「前端進階學(xué)習(xí)交流」，可以通過以下二維碼關(guān)注。轉(zhuǎn)載本文請聯(lián)系前端進階學(xué)習(xí)交流學(xué)公眾號。

分享標(biāo)題：一篇文章帶你了解JavaScript錯誤處理
文章URL：http://www.5511xx.com/article/cddcphg.html