【javascript進階】異常

前言

最近有些時間了，今天看了看博客的後臺記錄，好多都沒有寫博客呢，爭取儘快把之前的補上，javascrit中的異常在前端你們用的好像不是不少，其實javascript的異常和大多數的後端語言差不大，今天和你們簡單的介紹介紹，這裏不介紹啥是運行時異常......，這是說些javascript經常使用的異常和異常處理。

異常

使用關鍵字Error咱們能夠像new一個普通的對象同樣建立一個異常的實例，

var err = new Error("這是一個異常");

異常的屬性以下：

description: 錯誤描述  

fileName: 出錯的文件名 

lineNumber: 出錯的行數

message: 錯誤信息 

name: 錯誤類型  

number: 錯誤代碼 

stack: 像Java中的Stack Trace同樣的錯誤堆棧信息

上面各個瀏覽器之間會有不兼容的現象，你們瞭解基本的就行。

子類：

Error是全部異常的父類了，他有許多的子類，像

TypeError    當遇到一個意外的類型時引起該異常對象，如未聲明的變量。   

SyntaxError   在解析js代碼時，其中的語法錯誤引起該異常對象。   

ReferenceError   使用一個無效的引用時引起該異常對象。   

EvalError    在錯誤的調用eval函數時引起該異常對象。   

RangeError    在一個數字型變量的值超出了其範圍時引起該異常對象。   

URIError   在錯誤的使用encodeURI或者decodeURI函數時引起該異常對象。

等等。   　　

捕獲

try catch

其實捕獲異常是咱們最關注的問題，咱們不會沒事本身new出來一個異常吧，那不是沒事幹了嗎，咱們瞭解異常是爲了更好的處理它們。和其它的後端語言同樣，javascript使用try{}catch(){}捕獲異常，

try{
  //可能出現異常的代碼部分  
}catch(e){
    //處理異常
}finally{
    //任什麼時候候都會執行
}

弄個實際的例子

try{
	unde  //未定義的變量
}catch(e){
	console.dir(e);
}finally{
	alert("finally");
}

這就是捕獲代碼自己出現的錯誤，咱們能夠認爲的拋出一些異常，這就是throw關鍵字的做用了，看兩個例子

try{
  throw new Error("拋出一個異常");  //拋一個異常
}catch(e){
  alert(e.message);   //catch到異常
}

再看一個

try{
  throw("拋出一個異常");  //拋一個字符串
}catch(e){
  alert(e);   //catch到這個字符串
}

throw能夠拋出任何的對象，在catch中能夠捕獲到。

onerror

另一種捕獲javascript的異常就是window.onerror = function(){}，就是和普通的事件同樣，監聽異常事件，他有一些參數，各個瀏覽器可能會不一致，看看具體的用法

window.onerror = function(message, URI, lineNumber,columnNumber,errorObj) {
       console.log("錯誤信息：" , nessage);
       console.log("出錯文件：" , URI);
       console.log("出錯行號：" , lineNumber);
       console.log("出錯列號：" , columnNumber);
       console.dir(errorObj);
    }
throw new Error("個人異常');

結果是這樣的：

雖然咱們捕獲了出現的異常，可是瀏覽器仍是默認會把錯誤信息顯示出來，咱們在window.onerror = function(){} 加個返回值return true就不會顯示默認的錯誤信息了，這樣

window.onerror = function(message, URI, lineNumber,columnNumber,errorObj) {
       console.log("錯誤信息：" , nessage);
       console.log("出錯文件：" , URI);
       console.log("出錯行號：" , lineNumber);
       console.log("出錯列號：" , columnNumber);
       console.dir(errorObj);
       return true;
    }
throw new Error("個人異常');

這樣就不顯示瀏覽器默認的錯誤信息了。利用這個咱們就能夠忽略全部的錯誤了，能夠搞下惡做劇啥的，就這樣

window.onerror = function(){
  return true;  
}

其實若是咱們不從新onerror這個方法，原來就是空的，因此不寫的話咱們得不到一些異常信息。

異步中的異常

首先咱們看一下簡單的異步函數，最簡單的就是setTimeout了

setTimeout(function(){console.log(1)},1000);

That's all，簡單吧，騙你的，異步之後會將的，先這樣哈，異步不是今天的主角，咱們在異步函數中拋出一個異常試試

setTimeout(function(){throw new Error("個人異常")},1000);

如今咱們進行異常的捕獲，第一個方法try catch

try{
  setTimeout(function(){throw new Error("個人異常")},1000);  
}catch(e){
  alert(e.message);  
}

這樣累死也捕獲不到異常的，由於當trycatch執行的時候 function(){throw new Error("個人異常")尚未在內存堆棧中呢，這個你們先有點印象，之後在異步中會詳細說的，記住這樣是不能捕獲錯誤的。

固然你在裏面這樣是能夠捕獲的

setTimeout(function(){
                            try{throw new Error("個人異常")
                                }catch(e){
                                           alert(e.message);  
                                            }
                    },1000); 

咱們可使用window.onerror的方式來捕獲異步的異常，這樣

window.onerror = function(message, URI, lineNumber,columnNumber,errorObj) {
       console.log("錯誤信息：" , message);
       console.log("出錯文件：" , URI);
       console.log("出錯行號：" , lineNumber);
       console.log("出錯列號：" , columnNumber);
       console.dir(errorObj);
	   return true;
    }
setTimeout(function(){throw new Error("個人異常")},1000);

這樣確定是能夠的，由於是屬於監聽的方式，啥時候有錯誤啥時候執行。

小結

這樣，咱就瞭解了javascript的異常處理的基礎了，有興趣的同窗再深刻了解吧。