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 相关文章推荐
Document:getElementsByName()使用方法及示例
Oct 28 Javascript
Jquery.Form 异步提交表单的简单实例
Mar 03 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
Nov 29 Javascript
学习vue.js表单控件绑定操作
Dec 05 Javascript
jquery插件ContextMenu设置右键菜单
Mar 13 Javascript
Webpack打包慢问题的完美解决方法
Mar 16 Javascript
详解vue.js之绑定class和style的示例代码
Aug 24 Javascript
详解React之父子组件传递和其它一些要点
Jun 25 Javascript
vuejs实现折叠面板展开收缩动画效果
Sep 06 Javascript
利用JS动态生成隔行换色HTML表格的两种方法
Oct 09 Javascript
微信小程序实现swiper切换卡内嵌滚动条不显示的方法示例
Dec 20 Javascript
vue+element-ui+axios实现图片上传
Aug 20 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
php的字符串用法小结
2010/06/08 PHP
PHP ignore_user_abort函数详细介绍和使用实例
2014/07/15 PHP
PHP @ at 记号的作用示例介绍
2014/10/10 PHP
PHP进行批量任务处理不超时的解决方法
2016/07/11 PHP
微信 getAccessToken方法详解及实例
2016/11/23 PHP
js中点击空白区域时文本框与隐藏层的显示与影藏问题
2013/08/26 Javascript
常用js字符串判断方法整理
2013/10/18 Javascript
javascript实现倒计时N秒后网页自动跳转代码
2014/12/11 Javascript
javaScript实现可缩放的显示区效果代码
2015/10/26 Javascript
基于Jquery插件实现跨域异步上传文件功能
2016/04/26 Javascript
微信JS-SDK坐标位置如何转换为百度地图坐标
2016/07/04 Javascript
轮播的简单实现方法
2016/07/28 Javascript
JS实现淡入淡出图片效果的方法分析
2016/12/20 Javascript
require.js与bootstrap结合实现简单的页面登录和页面跳转功能
2017/05/12 Javascript
Ext JS 实现建议词模糊动态搜索功能
2017/05/13 Javascript
详解vue跨组件通信的几种方法
2017/06/15 Javascript
微信小程序实现即时通信聊天功能的实例代码
2018/08/17 Javascript
Vue infinite update loop的问题解决
2019/04/23 Javascript
js对象数组和对象的使用实例详解
2019/08/27 Javascript
详细解读tornado协程(coroutine)原理
2018/01/15 Python
Python中的取模运算方法
2018/11/10 Python
python对于requests的封装方法详解
2019/01/03 Python
Python跳出多重循环的方法示例
2019/07/03 Python
pyftplib中文乱码问题解决方案
2020/01/11 Python
Python实现随机生成任意数量车牌号
2020/01/21 Python
基于PyInstaller各参数的含义说明
2021/03/04 Python
html5 音乐播放器 audio 标签使用概述
2013/07/15 HTML / CSS
英国护肤品购物网站:Beauty Expert
2016/08/19 全球购物
葡萄牙航空官方网站:TAP Air Portugal
2019/10/31 全球购物
机械设计专业应届生求职信
2013/11/21 职场文书
2014年元旦促销活动方案
2014/02/22 职场文书
关于法制教育的宣传语
2015/07/13 职场文书
入党宣誓大会后的感想
2015/08/10 职场文书
解决MySQL存储时间出现不一致的问题
2021/04/28 MySQL
js实现模拟购物商城案例
2021/05/18 Javascript
Golang二维数组的使用方式
2021/05/28 Golang