JavaScript基礎(chǔ)入門之錯誤捕獲機(jī)制
前言
Javascript 引擎是單線程的,因此一旦遇到異常,Javascript 引擎通常會停止執(zhí)行,阻塞后續(xù)代碼并拋出一個異常信息,因此對于可預(yù)見的異常,我們應(yīng)該捕捉并正確展示給用戶或開發(fā)者。
Error 對象
當(dāng)運(yùn)行時錯誤產(chǎn)生時,Error的實例對象會被拋出。
該錯誤對象有兩個屬性:
- err.name:錯誤的名稱/錯誤的類型
- err.message:錯誤的提示信息
創(chuàng)建一個Error
new Error([message[,fileName[,lineNumber]]])
錯誤類型js共定義了下列 7 種錯誤類型:
- Error
- EvalError
- RangeError
- ReferenceError
- SyntaxError
- TypeError
- URIError
throw
有些JavaScript代碼沒有語法上的錯誤,但是存在邏輯錯誤,對于這種錯誤,JavaScript不會拋出異常,這時候我們可以自己定義一個error對象的實例,并使用throw語句來主動拋出異常。在程序中我們可以通過使用throw語句有目的的拋出異常,其語法格式如下:
throw new Error("errorstatements")
try…catch…finally
- try 可能發(fā)生異常的代碼
- catch(error) 發(fā)生錯誤執(zhí)行的代碼
- finally 無論如何都會執(zhí)行的代碼
三種形式的 try 聲明:
- try...catch
- try...finally
- try...catch...finally
finally 的規(guī)則
當(dāng)在 finally 塊中拋出異常信息時會覆蓋掉 try 塊中的異常信息
try { try { throw new Error('can not find it1'); } finally { throw new Error('can not find it2'); } } catch (err) { console.log(err.message); } // can not find it2
如果從 finally 塊中返回一個值,那么這個值將會成為整個 try-catch-finally 的返回值,無論是否有 return 語句在 try 和 catch 中。這包括在 catch 塊里拋出的異常。
function test() { try { throw new Error('can not find it1'); return 1; } catch (err) { throw new Error('can not find it2'); return 2; } finally { return 3; } } console.log(test()); // 3
Try / Catch 性能
有一個大家眾所周知的反優(yōu)化模式就是使用 try/catch
在V8(其他JS引擎也可能出現(xiàn)相同情況)函數(shù)中使用了 try/catch 語句不能夠被V8編譯器優(yōu)化.
window.onerror
通過在 window.onerror 上定義一個事件監(jiān)聽函數(shù),程序中其他代碼產(chǎn)生的未被捕獲的異常往往就會被 window.onerror 上面注冊的監(jiān)聽函數(shù)捕獲到
window.onerror = function (message, source, lineno, colno, error) { }
- message:異常信息(字符串)
- source:發(fā)生異常的腳本URL(字符串)
- lineno:發(fā)生異常的行號(數(shù)字)
- colno:發(fā)生異常的列號(數(shù)字)
- error:Error對象(對象)
Promise 中的異常
Promise 中拋出異常
- new Promise((resolve,reject)=>{ reject(); })
- Promise.resolve().then((resolve,reject)=>{ reject(); });
- Promise.reject();
- throw expression;
Promise中捕捉異常
- promiseObj.then(undefined, (err)=>{ catch_statements });
- promiseObj.catch((exception)=>{ catch_statements })
注意
在 JavaScript 函數(shù)中,只有 return / yield / throw 會中斷函數(shù)的執(zhí)行,reject 不會阻止繼續(xù)執(zhí)行
示例:
沒有 return 的 reject
Promise.resolve() .then(() => { console.log('before excute reject'); reject(new Error('throw error')); console.log('after excute reject'); }) .catch((err) => { console.log(err.message); }); // before excute reject // throw error // after excute reject
用了 return 的 reject
Promise.resolve() .then(() => { console.log('before excute reject'); return reject(new Error('throw error')); console.log('after excute reject'); //*** 區(qū)別在這里,return 的話這里不會執(zhí)行了 }) .catch((err) => { console.log(err.message); }); // before excute reject // throw error
Vue 的異常捕獲
Vue.config.errorHandler = (err, vm, info) => { console.error("通過vue errorHandler捕獲的錯誤"); console.error(err); console.error(vm); console.error(info); };
總結(jié)
到此這篇關(guān)于JavaScript基礎(chǔ)入門之錯誤捕獲機(jī)制的文章就介紹到這了,更多相關(guān)js錯誤捕獲機(jī)制內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
bootstrap實現(xiàn)的自適應(yīng)頁面簡單應(yīng)用示例
這篇文章主要介紹了bootstrap實現(xiàn)的自適應(yīng)頁面簡單應(yīng)用,結(jié)合具體實例形式分析了基于bootstrap的列表布局結(jié)構(gòu)頁面實現(xiàn)與使用技巧,需要的朋友可以參考下2017-03-03hash特點(diǎn)、hashchange事件介紹及其常見應(yīng)用場景
淺析hash特點(diǎn)、hashchange事件介紹及其常見應(yīng)用場景(不同hash對應(yīng)不同事件處理、移動端大圖展示狀態(tài)后退頁面問題、原生輕應(yīng)用頭部后退問題、移動端自帶返回按鈕二次確認(rèn)問題),hashchange和popstate事件觸發(fā)條件2023-11-11JavaScript實現(xiàn)寫入文件到本地的方法【基于FileSaver.js插件】
這篇文章主要介紹了JavaScript實現(xiàn)寫入文件到本地的方法,結(jié)合實例形式分析了基于FileSaver.js插件實現(xiàn)保存文件到本地的相關(guān)操作技巧,并附帶FileSaver.js插件完整源碼,需要的朋友可以參考下2018-03-03關(guān)于使用runtimeStyle屬性問題討論文章
關(guān)于使用runtimeStyle屬性問題討論文章...2007-03-03jscript之Read an Excel Spreadsheet
jscript之Read an Excel Spreadsheet...2007-06-06