如何在 Chrome 的性能分析器中调试匿名 JavaScript 函数？

Posted 2023-03-07

【中文标题】如何在 Chrome 的性能分析器中调试匿名 JavaScript 函数？

【英文标题】：How can I debug anonymous JavaScript functions in Chrome's performance analyzer?

【发布时间】：2018-04-15 02:10:15

【问题描述】：

我正在使用 Angular 4，并且正在使用许多匿名箭头函数 (() => )。是否可以在不给它们命名的情况下确定我在 Chrome 的性能分析器中调试了哪些函数？

这是我正在查看的示例；

【问题讨论】：

我不想像这篇文章那样创建一个包含所有匿名函数的变量。我想跟踪匿名函数，我应该更改帖子的标题，

How do I write a named arrow function in ES2015?的可能重复

基于编辑/澄清，我撤回了我的欺骗投票，但我怀疑答案可能仍然是“你不能，你需要命名它们”，the post I originally linked to 向你展示如何。

我认为这是一个完全有效的问题，除非确实存在与此完全相同的问题的重复，否则应删除接近投票。如果有的话，DevTools 需要为这个非常明显的用例提供更直接的 UI。

【参考方案1】：

点击Main图表中的函数将其选中。 DevTools 将其突出显示为蓝色。在摘要标签中，您可以看到有关该功能的更多信息。

点击Function旁边的链接以在Sources面板中查看该函数的源代码。

我认为性能面板会自动格式化压缩文件，但如果没有，您可以通过单击 Format 手动取消压缩。