JavaScript实现显示函数调用堆栈的方法


Posted in Javascript onApril 21, 2016

本文实例讲述了JavaScript实现显示函数调用堆栈的方法。分享给大家供大家参考,具体如下:

许多大型的JavaScript应用程序间的函数调用关系是非常复杂的,在开发或者调试过程中,经常需要跟踪某个函数是由哪些函数调用后才触发执行的,弄清楚这些函数的调用顺序对我们理解代码的数据流向是非常重要的。

Firebug提供了console.trace()来显示函数堆栈,在需要调试的地方加上下面的一行代码就能显示该函数调用时的上下文关系。IE6就没有这么方便了,它没有提供显示函数堆栈的工具,当不可避免的需要在IE6下调试代码时,使用下面的代码能够显示函数堆栈(建议将下面的JavaScript代码保存为console.trace.js,通过外部引入js的方式引用到页面):

JAVASCRIPT代码如下:

/**
* 获取函数名称
*
* @param {Function} func 函数引用
* @return {String} 函数名称
*/
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) {
  /**
   * 显示函数堆栈<br/>
   * 为了和Firebug统一,将trace方法添加到console对象中
   *
   * @param {Function} func 函数引用
   *
   * @example
function 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'));
  }
};

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
用javascript实现兼容IE7的类库 IE7_0_9.zip提供下载
Aug 08 Javascript
在myeclipse中如何加入jquery代码提示功能
Jun 03 Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
Aug 12 Javascript
JavaScript获取当前url根目录(路径)
Jun 17 Javascript
最原始的jQuery注册验证方式
Oct 11 Javascript
微信小程序五星评分效果实现代码
Apr 06 Javascript
Vue响应式原理详解
Apr 18 Javascript
jquery对table做排序操作的实例演示
Aug 10 jQuery
javascript 中模板方法单例的实现方法
Oct 17 Javascript
基于vue-simplemde实现图片拖拽、粘贴功能
Apr 12 Javascript
JS设置自定义快捷键并实现图片上下左右移动
Oct 17 Javascript
JavaScript 严格模式(use strict)用法实例分析
Mar 04 Javascript
JS实现队列与堆栈的方法
Apr 21 #Javascript
JS、jQuery中select的用法详解
Apr 21 #Javascript
jQuery中iframe的操作(点击按钮新增窗口)
Apr 20 #Javascript
JS生成某个范围的随机数【四种情况详解】
Apr 20 #Javascript
浅析JS动态创建元素【两种方法】
Apr 20 #Javascript
纯JS代码实现一键分享功能
Apr 20 #Javascript
JavaScript动态生成二维码图片
Apr 20 #Javascript
You might like
使用sockets:从新闻组中获取文章(一)
2006/10/09 PHP
聊天室php&amp;mysql(四)
2006/10/09 PHP
PHP小教程之实现链表
2014/06/09 PHP
php开发工具有哪五款
2015/11/09 PHP
php简单统计在线人数的方法
2016/05/10 PHP
JS JSON对象转为字符串的简单实现方法
2013/11/18 Javascript
基于jquery编写的放大镜插件
2016/03/23 Javascript
js实现图片淡入淡出切换简易效果
2016/08/22 Javascript
jQuery实现的多张图无缝滚动效果【测试可用】
2016/09/12 Javascript
jQuery Ajax全解析
2017/02/13 Javascript
Javascript实现登录记住用户名和密码功能
2017/03/22 Javascript
Angular中ng-repeat与ul li的多层嵌套重复问题
2017/07/24 Javascript
Vue.js实现双向数据绑定方法(表单自动赋值、表单自动取值)
2018/08/27 Javascript
在Python的web框架中编写创建日志的程序的教程
2015/04/30 Python
web.py在SAE中的Session问题解决方法(使用mysql存储)
2015/06/24 Python
Python学习笔记之解析json的方法分析
2017/04/21 Python
python之文件读取一行一行的方法
2018/07/12 Python
python对验证码降噪的实现示例代码
2019/11/12 Python
python Manager 之dict KeyError问题的解决
2019/12/21 Python
pycharm的python_stubs问题
2020/04/08 Python
浅谈Python爬虫原理与数据抓取
2020/07/21 Python
关于pycharm 切换 python3.9 报错 ‘HTMLParser‘ object has no attribute ‘unescape‘ 的问题
2020/11/24 Python
DC Shoes官网:美国滑板鞋和服饰品牌
2017/09/03 全球购物
eBay奥地利站:eBay.at
2019/07/24 全球购物
汽车维修专业毕业生的求职信分享
2013/12/04 职场文书
2014三八妇女节活动总结范文四篇
2014/03/09 职场文书
中等生评语大全
2014/05/04 职场文书
电焊工岗位工作职责
2014/07/09 职场文书
幼儿园感恩节活动方案2014
2014/10/11 职场文书
乡镇党建工作汇报材料
2014/10/27 职场文书
优秀班组事迹材料
2014/12/24 职场文书
大学升旗仪式主持词
2015/07/04 职场文书
掌握一个领域知识,高效学习必备方法
2019/08/08 职场文书
长辈生日祝福语大全(72句)
2019/08/09 职场文书
HTML5 新增内容和 API详解
2021/11/17 HTML / CSS
鲲鹏 CentOS 7 安装Python3.7
2022/05/11 Servers