在 Google Chrome 中调试时是否可以更改 javascript 变量值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4603021/
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
Is it possible to change javascript variable values while debugging in Google Chrome?
提问by tato
I'm debugging a javascript app (using Chrome dev tools), and I would like to change some variable values while stepping through the code.
我正在调试一个 javascript 应用程序（使用 Chrome 开发工具），我想在逐步执行代码时更改一些变量值。
Is that possible at all?
这可能吗？
I have tried and got something like:
我试过并得到了类似的东西：
> modeline
1
> modeline=0
0 <<< seems to work but...
> modeline
1 <<< ups!!
But I'm unable to find any documentation that states what can or can't be done...
但是我找不到任何说明可以做什么或不能做什么的文档......
采纳答案by gilly3
Why is this answer still getting upvotes?
为什么这个答案仍然得到赞成？
Per Mika?l Mayer's answer, this is no longer a problem, and my answer is obsolete (go()now returns 30after mucking with the console). This was fixed in July 2013, according to the bug reportlinked above in gabrielmaldi's comment. It alarms me that I'm still getting upvotes - makes me think the upvoter doesn't understand either the question or my answer.
根据Mika?l Mayer 的回答，这不再是问题，而且我的回答已过时（go()现在30在与控制台混在一起后返回）。根据上面gabrielmaldi 评论中链接的错误报告，此问题已于 2013 年 7 月修复。这让我感到震惊，我仍然在获得赞成票 - 让我认为赞成票的人既不理解问题，也不理解我的答案。
I'll leave my original answer here for historical reasons, but go upvote Mika?l's answerinstead.
出于历史原因，我会在这里留下我的原始答案，但请改为支持Mika?l 的答案。
The trick is that you can't change a local variable directly, but you can modify the properties of an object. You can also modify the value of a global variable:
诀窍是您不能直接更改局部变量，但可以修改对象的属性。您还可以修改全局变量的值：
var g_n = 0;
function go()
{
var n = 0;
var o = { n: 0 };
return g_n + n + o.n; // breakpoint here
}
console:
安慰：
> g_n = 10
10
> g_n
10
> n = 10
10
> n
0
> o.n = 10
10
> o.n
10
Check the result of go()after setting the breakpoint and running those calls in the console, and you'll find that the result is 20, rather than 0 (but sadly, not 30).
检查go()设置断点并在控制台中运行这些调用后的结果，您会发现结果是 20，而不是 0（但遗憾的是，不是 30）。
回答by Mika?l Mayer
This is now possible in chrome 35 (today as of July 11, 2014). I don't know which version allowed it first though.
这现在可以在 chrome 35 中实现（截至 2014 年 7 月 11 日）。我不知道哪个版本首先允许它。
Just tested @gilly3 example on my machine and it works.
刚刚在我的机器上测试了 @gilly3 示例，它可以工作。
Open the console, in
Sourcesand the tabSnippets, add a new snippet, paste the following code into it:var g_n = 0; function go() { var n = 0; var o = { n: 0 }; return g_n + n + o.n; // breakpoint here }Right-click the snippet name, click 'Run' (this does not fire the function though)
- Add the breakpoint at the return statement.
- In the console below, type
go() - and change the variable values as demonstrated below
打开控制台，在
Sources选项卡中Snippets，添加一个新代码段，将以下代码粘贴到其中：var g_n = 0; function go() { var n = 0; var o = { n: 0 }; return g_n + n + o.n; // breakpoint here }右键单击代码段名称，单击“运行”（尽管这不会触发该功能）
- 在 return 语句处添加断点。
- 在下面的控制台中，键入
go() - 并更改变量值，如下所示
and the returned result g_n + n + o.nis 30.
返回的结果g_n + n + o.n是30。
回答by brianpeiris
This is an acknowledged bug in the Chrome Dev Tools:
这是 Chrome 开发工具中的一个公认错误：
回答by Vlad GURDIGA
It looks like not.
好像没有。
Put a breakpoint, when it stops switch to the console, try to set the variable. It does not error when you assign it a different value, but if you read it after the assignment, it's unmodified. :-/
放一个断点，当它停止时切换到控制台，尝试设置变量。当您为其分配不同的值时不会出错，但如果您在分配后阅读它，则它没有被修改。:-/
回答by Bobo
Firebug seems to allow you to do that.
Firebug 似乎允许您这样做。
回答by Tyler Collier
Yes! Finally! I just tried it with Chrome, Version 66.0.3359.170 (Official Build) (64-bit) on Mac.
是的！最后！我刚刚在 Mac 上使用 Chrome 版本 66.0.3359.170（官方版本）（64 位）进行了尝试。
You can change the values in the scopes as in the first picture, or with the console as in the second picture.
您可以像第一张图片那样更改示波器中的值，或者像第二张图片那样使用控制台更改值。
回答by Jeff Lowery
I'm able to modify a script variable value by assignment in the Console. Seems simplest.
我可以通过在控制台中赋值来修改脚本变量值。看起来最简单。
回答by mdubez
Actually there is a workaround. Copy the entire method, modify it's name, e.g. originalName() to originalName2() but modify the variable inside to take on whatever value you want, or pass it in as a parameter.
其实是有办法的。复制整个方法，修改它的名称，例如 originalName() 到 originalName2() 但修改里面的变量以采用您想要的任何值，或者将其作为参数传递。
Then if you call this method directly from the console, it will have the same functionality but you will be able to modify the variable values.
然后，如果您直接从控制台调用此方法，它将具有相同的功能，但您将能够修改变量值。
If the method is called automatically then instead type into the console
如果该方法被自动调用，则改为在控制台中键入
originalName = null;
function originalName(original params..)
{
alert("modified internals");
add whatever original code you want
}
回答by LeonardoX
I don't know why chrome team don't allow this silly feature ... but the only way I could change variable values with success is to modify the script directly in the chrome editor under "Sources" Tab (this changes the behavior of your script until you refresh the page), but that changes will lost when refresh, so be carefull.
我不知道为什么 chrome 团队不允许这个愚蠢的功能......但我可以成功更改变量值的唯一方法是直接在“源”选项卡下的 chrome 编辑器中修改脚本（这会改变您的脚本，直到您刷新页面），但刷新时更改将丢失，因此请小心。
回答by GilesDMiddleton
I was having the same issue, went to the 'About Google Chrome'->Help and it said I needed to restart my browser to get the latest updates.
我遇到了同样的问题，转到“关于 Google Chrome”->“帮助”，它说我需要重新启动浏览器以获取最新更新。
I did this, and suddenly, I can now change local variables. Simply click the variable you want to edit in the Scope Variables window, and type in your new value.
我这样做了，突然间，我现在可以更改局部变量了。只需在“范围变量”窗口中单击要编辑的变量，然后输入新值。
I did notice some oddities though, that I had to step over some unrelated var assignments before I could alter the text in the right hand window (Scope Variables).
不过，我确实注意到了一些奇怪的地方，在我可以更改右侧窗口（范围变量）中的文本之前，我必须跳过一些不相关的 var 分配。
