【问题标题】:How can I find out which methods are called in Javascript when debugging without knowing the methods beforehand?在事先不知道方法的情况下,如何在调试时找出在 Javascript 中调用了哪些方法?
【发布时间】:2015-04-21 11:38:04
【问题描述】:

例如,我想调试第三方库。它里面有很多功能,我不知道从哪里开始。有没有一种快速的方法来找出哪些函数在没有事先了解代码库的情况下被触发,因此不知道在哪里放置断点?

【问题讨论】:

  • 不确定,但有时分析器会有所帮助。
  • 我曾经遇到过同样的情况,我有足够的动力不惜一切代价去做。因此,我在 C# 中构建了一个实用程序,该实用程序遍历了我的 javascript 文件中的每个函数,并在每个函数之上编写了 console.log(nameOfCurrentFunction)。然后我写了一个函数,作为所有 console.log() 的开关。
  • 现在我很兴奋地意识到我这样做是多么愚蠢。
  • 为什么要调试第三方代码?
  • 我为什么不想呢?

标签: javascript debugging events firebug google-chrome-devtools


【解决方案1】:

要查看调用了哪些函数,您应该使用您最喜欢的调试工具的 JavaScript 分析器。

这些分析器会输出有关从何处调用哪些函数以及调用频率(即它们的成本有多大)的信息。

在 Firebug(2.0 版)中:

  1. 启用脚本控制台面板
  2. 切换到控制台面板
  3. 点击个人资料按钮
  4. 执行一些操作,调用第三方代码中的函数。
  5. 再次点击个人资料按钮

结果:

在 Firefox 开发者工具中:

  1. 切换到性能面板
  2. 点击开始录制表演按钮
  3. 执行一些操作,调用第三方代码中的函数。
  4. 单击停止录制性能按钮
  5. 切换到调用树标签

结果:

在 Chrome/Opera DevTools 中:

  1. 切换到时间轴面板
  2. 单击录制按钮(或按Ctrl+E
  3. 执行一些操作,调用第三方代码中的函数。
  4. 点击完成按钮
  5. 切换到汇总详情标签

【讨论】:

    【解决方案2】:

    通常第三方会公开一个变量或函数,例如 jQuery、$window.whatever

    浏览器开发工具(不管是 Firefox DevTools、Chrome DevTools、Opera 中的 Web Inspector 还是 Firebug)提供了一种在其 JavaScript 调试工具中创建监视表达式的方法。根据您使用的工具,相关面板被称为 Watch ExpressionsWatchVariables

    在那里,添加您知道的变量,展开它并从那里开始搜索。

    【讨论】:

    • 一点都不实用。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-10-01
    • 1970-01-01
    • 1970-01-01
    • 2013-09-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多