本文實(shí)例講述了JavaScript實(shí)現(xiàn)顯示函數(shù)調(diào)用堆棧的方法。分享給大家供大家參考,具體如下:
許多大型的JavaScript應(yīng)用程序間的函數(shù)調(diào)用關(guān)系是非常復(fù)雜的,在開發(fā)或者調(diào)試過程中,經(jīng)常需要跟蹤某個(gè)函數(shù)是由哪些函數(shù)調(diào)用后才觸發(fā)執(zhí)行的,弄清楚這些函數(shù)的調(diào)用順序?qū)ξ覀兝斫獯a的數(shù)據(jù)流向是非常重要的。
Firebug提供了console.trace()來顯示函數(shù)堆棧,在需要調(diào)試的地方加上下面的一行代碼就能顯示該函數(shù)調(diào)用時(shí)的上下文關(guān)系。IE6就沒有這么方便了,它沒有提供顯示函數(shù)堆棧的工具,當(dāng)不可避免的需要在IE6下調(diào)試代碼時(shí),使用下面的代碼能夠顯示函數(shù)堆棧(建議將下面的JavaScript代碼保存為console.trace.js,通過外部引入js的方式引用到頁面):
JAVASCRIPT代碼如下:
/*** 獲取函數(shù)名稱** @param {Function} func 函數(shù)引用* @return {String} 函數(shù)名稱*/function getFunctionName(func) { if ( typeof func == 'function' || typeof func == 'object' ) { var name = ('' + func).match(/function/s*([/w/$]*)/s*/(/); } return name && name[1];}if (!('console' in window)) { window.console = {};}if (!console.trace) { /** * 顯示函數(shù)堆棧<br/> * 為了和Firebug統(tǒng)一,將trace方法添加到console對(duì)象中 * * @param {Function} func 函數(shù)引用 * * @examplefunction a() {b();}function b() {c();}function c() {d();}function d() {console.trace();}a(); */ console.trace = function() { var stack = [], caller = arguments.callee.caller; while (caller) { stack.unshift(getFunctionName(caller)); caller = caller && caller.caller; } alert('functions on stack:' + '/n' + stack.join('/n')); }};更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注