如何在 Chrome 调试器中检查 JavaScript 函数返回值?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9662422/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 07:22:59  来源:igfitidea点击:

How to inspect JavaScript function return value in Chrome debugger?

javascriptgoogle-chromegoogle-chrome-devtools

提问by John Freeman

Coming from gdb, it would print the return value of a function when it finished. Is there a way to get this information from the Chrome debugger without changing the source being debugged?

来自 gdb,它会在完成时打印函数的返回值。有没有办法在不更改被调试源的情况下从 Chrome 调试器中获取这些信息?

采纳答案by klm

A fix for thiswas implemented as of Nov 5, 2013, but apparently is only released, while I'm writing this, in Chrome Canary. (I see it in 33.0.1719.0, but don't see it in the Chrome Beta version 32.0.1700.19 beta.)

对此的修复已于 2013 年 11 月 5 日实施,但显然仅在我撰写本文时在 Chrome Canary 中发布。(我在 33.0.1719.0 中看到它,但在 Chrome Beta 版 32.0.1700.19 beta 中没有看到它。)

If the version you're running does have it, then when you step through a return statement, the debugger's Scope VariablesLocal scope includes a <return>entry with the value.

如果您正在运行的版本确实有它,那么当您单步执行 return 语句时,调试器的Scope Variables本地范围包括一个<return>带有该值的条目。

(I need to use Canary for the main debugging I do, but didn't notice the presence of the <return>entry until seeing the referenced noticein the issue!)

(我需要使用 Canary 进行我所做的主要调试,但<return>直到看到问题中引用的通知才注意到条目的存在!)

回答by moodboom

I'm using Chrome Version 57.0.2987.98 beta (64-bit) and it's in there, and really nice to have. Here's a screenshot:

我正在使用 Chrome 版本 57.0.2987.98 测试版(64 位),它就在那里,非常好用。这是一个屏幕截图:

enter image description here

在此处输入图片说明

回答by user1050483

My version of Chrome is 41.0.2272.118 m. Here is one good reason why you should place complex return statements on a separate line. If you add a breakpoint on any line after the return, Chrome will add (in this example) a "<return>: true" leaf under the "Local" node of the "Scope Variables" pane of the Sources panel when the breakpoint is hit.

我的 Chrome 版本是 41.0.2272.118 m。这是您应该将复杂的 return 语句放在单独的行上的一个很好的理由。如果在 return 后的任何行添加断点,Chrome 将在 Sources 面板的“Scope Variables”窗格的“Local”节点下添加(在本例中)一个“<return>: true”叶,当断点为打。

function bar() {
   return true;
}    
(function foo() {
   return bar();
})(); // Place breakpoint here

回答by T.J. Crowder

No, there isn't a way at present.

不,目前没有办法。

There is an open enhancement requestfor it, however. It's assigned, and as of this writing it's waiting on this V8 enhancement.

然而,有一个开放的增强请求。它已分配,在撰写本文时,它正在等待此 V8 增强功能

回答by Waynn Lue

If you set a breakpoint, you can hover your mouse over variables and it'll show what the values are -- does that work for what you're trying to do?

如果您设置了断点,您可以将鼠标悬停在变量上,它会显示值是什么——这对您要执行的操作有效吗?

回答by Bez Hermoso

Maybe this will do?

也许这会做?

1.) View the page source.

1.) 查看页面源。

2.) Look for the function definition and copy it to your clipboard.

2.) 查找函数定义并将其复制到剪贴板。

3.) Modify the function definition on your clipboard to log the value that it is about to return. (i.e., console.log(x); return x;)

3.) 修改剪贴板上的函数定义以记录它即将返回的值。(即,console.log(x); return x;

4.) Paste the patched function definition into the console and run it. This will override the existing function.

4.) 将修补后的函数定义粘贴到控制台并运行它。这将覆盖现有功能。

5.) Trigger the function.

5.) 触发功能。

回答by Vsevolod Solovyov

It's still not possible in Chrome, but it's possible in Firefox 24+. You need to Step Out (Shift+F11) from a function, and it will display the return value or the exception thrown in Function scope.

在 Chrome 中仍然不可能,但在 Firefox 24+ 中是可能的。您需要从函数中跳出(Shift+F11),它会显示返回值或在函数范围内抛出的异常。