在 Chrome 中查找 JavaScript 函数定义

假设我们正在寻找名为 foo 的函数：

（打开 Chrome 开发工具），Windows：ctrl + shift + F，或 macOS：cmd + optn + F。这将打开一个用于搜索所有脚本的窗口。选中“正则表达式”复选框，搜索 foo\s*=\s*function（搜索 foo = function，在这三个标记之间有任意数量的空格），按下返回的结果。

函数定义的另一个变体是 function foo( 的 function\s*foo\s*\(，这三个标记之间有任意数量的空格。

这个landed in Chrome on 2012-08-26不确定确切的版本，我在 Chrome 24 中注意到它。

一张截图值一百万字：

https://i.stack.imgur.com/HJYn6.png

我正在使用控制台中的方法检查对象。单击“显示函数定义”会将我带到源代码中定义函数的位置。或者我可以将鼠标悬停在 function () { 词上以查看工具提示中的函数体。您可以像这样轻松检查整个原型链！ CDT绝对摇滚！！！

希望对大家有所帮助！

您可以通过在控制台中评估函数的名称来打印函数，如下所示

> unknownFunc
function unknownFunc(unknown) {
    alert('unknown seems to be ' + unknown);
}

这不适用于内置函数，它们只会显示 [native code] 而不是源代码。

编辑：这意味着该函数已在当前范围内定义。

2016 更新：在 Chrome 版本 51.0.2704.103 中

有一个 Go to member 快捷方式（列在 settings > shortcut > Text Editor 中）。打开包含您的函数的文件（在 DevTools 的 sources 面板中）并按：

ctrl + shift + O

或在 OS X 中：

⌘ + 班次 + O

这可以列出和访问当前文件的成员。

导航到函数定义位置的另一种方法是在调试器中中断您可以访问函数的位置并在控制台中输入函数的完全限定名称。这将在控制台中打印函数定义并给出一个链接，单击该链接将打开定义函数的脚本位置。

https://i.imgur.com/qkIH4WZ.png

不同的浏览器执行此操作的方式不同。

首先通过右键单击页面并选择“检查元素”或按 F12 打开控制台窗口。在控制台中，键入... Firefox functionName.toSource() Chrome functionName

在 Chrome 控制台中：

debug(MyFunction)
MyFunction()

我发现找到全局函数的最快方法很简单：

选择来源选项卡。在 Watch 窗格中单击 + 并键入 window 您的全局函数引用首先按字母顺序列出。右键单击您感兴趣的函数。在弹出菜单中选择显示函数定义。源代码窗格切换到该函数定义。

在 Google chrome 中，Inspect element 工具可以查看任何 Javascript 函数定义。

单击源选项卡。然后选择索引页。搜索功能。

https://i.stack.imgur.com/jRubU.png

选择该函数，然后右键单击该函数并选择“在控制台中评估所选文本”。

https://i.stack.imgur.com/MkTyq.png

我在寻找对象方法的来源时遇到了类似的问题。对象名称为 myTree，其方法为 load。我在调用该方法的行上放了一个断点。通过重新加载页面，执行在该点停止。然后在 DevTools 控制台上，我键入对象和方法名称，即 myTree.load 并按 Enter。该方法的定义打印在控制台上：

https://i.stack.imgur.com/1UhSn.png

此外，通过右键单击定义，您可以转到源代码中的定义：

https://i.stack.imgur.com/rV1hM.png

如果您已经在调试，您可以将鼠标悬停在函数上，工具提示将允许您直接导航到函数定义：

https://i.stack.imgur.com/axT3Y.png

延伸阅读：

Chrome 开发者工具 > JavaScript 调试参考

你遇到 VM 定义的 JS 函数，你可以在下面的 Chrome 控制台面板中尝试这个命令。像这样： foo 函数名是 window.P.execute

>window.P.execute.toString()
<'function(d,h){function n(){var a=null;e?a=h:"function"===typeof h&&(p.start=w(),a=h.apply(f,wa(d,k,l)),p.end=w());if(b){H[d]=a;a=d;for(da[a]=!0;(z[a]||[]).length;)z[a].shift()();delete z[a]}p.done=!0}var k=g||this;"function"===typeof d&&(h=d,d=E);b&&(d=d?d.replace(ha,""):"__NONAME__",V.hasOwnProperty(d)&&k.error(q(", reregistered by ",q(" by ",d+" already registered",V[d]),k.attribution),d),V[d]=k.attribution);for(var l=[],m=0;m<a.length;m++)l[m]=\na[m].replace(ha,"");var p=B[d||"anon"+ ++xa]={depend:l,registered:w(),namespace:k.namespace};d&&ya.hasOwnProperty(d);c?n():ua(l,k.guardFatal(d,n),d);return{decorate:function(a){U[d]=k.guardFatal(d,a)}}}'

所以我们得到了完整的功能代码。