javascript javascript控制台的`binding.pry`?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17096263/
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-27 07:04:26  来源:igfitidea点击:

`binding.pry` for javascript console?

javascriptrubyread-eval-print-looppry

提问by cgenco

In Ruby, I can type binding.pryanywhere in my code and at that point of execution my console will enter a REPL where I have access to all local variables, can make changes, and execute any arbitrary code.

在 Ruby 中,我可以binding.pry在代码中的任何位置键入,在执行时,我的控制台将进入一个 REPL,我可以在其中访问所有局部变量,可以进行更改并执行任意代码。

Example:

例子:

# foo.rb
require 'pry'
n = 5
binding.pry
puts "your number is #{n}"

When I run it:

当我运行它时:

$ ruby foo.rb

From: /Users/cgenco/Desktop/foo.rb @ line 4 :

    1: # foo.rb
    2: require 'pry'
    3: n = 5
 => 4: binding.pry
    5: puts "your  number is #{n}"

[1] pry(main)> n = 100
=> 100
[2] pry(main)> exit
your number is 100

This is an incredible tool in debugging, especially for situations that require a complicated setup: I can just type binding.pryat the spot I need more code, mess around, figure out what code needs to written, then add the polished code to the actual source code.

这是一个令人难以置信的调试工具,特别是对于需要复杂设置的情况:我可以binding.pry在需要更多代码的地方输入,乱七八糟,弄清楚需要编写哪些代码,然后将完善的代码添加到实际源代码中.

Is there a tool like pryfor javascript that works in a browser console?

是否有像pry这样的工具可以在浏览器控制台中运行?

回答by Pigueiras

Try with debugger;in your code as this answer suggests. Your browser developer toolsmust be open.

debugger;按照这个答案的建议,在您的代码中尝试使用。您的浏览器开发工具必须是打开的。

回答by Dan Tao

Most browsers have developer tools that are quite similar to this.

大多数浏览器都有与此非常相似的开发人员工具。

In Chrome, for example, hit Ctrl+Shift+Ito bring up the developer tools panel. Click on the "Sources" tab and you can browse any JavaScript files that have been loaded. From here you can set breakpointsby clicking in the left margin. Now when you reload the page, JavaScript execution will pause at the line you indicated.

例如,在 Chrome 中,点击Ctrl+ Shift+I以调出开发人员工具面板。单击“源”选项卡,您可以浏览任何已加载的 JavaScript 文件。从这里您可以通过单击左边距来设置断点。现在,当您重新加载页面时,JavaScript 执行将在您指定的行处暂停。

At the bottom of the panel there is a "Show console" button that will open up a REPL you can play around with.

在面板的底部有一个“显示控制台”按钮,它会打开一个你可以玩的 REPL。

Here is a screenshot illustrating everything I just mentioned:

这是一个屏幕截图,说明了我刚刚提到的所有内容:

Screenshot of Chrome developer tools on StackOverflow

StackOverflow 上的 Chrome 开发者工具截图

There are similar tools in Firefox, IE, Safari, and Opera. Just Google for "developer tools [your browser of choice]" to learn more about them.

在 Firefox、IE、Safari 和 Opera 中也有类似的工具。只需在 Google 上搜索“开发者工具 [您选择的浏览器]”即可了解有关它们的更多信息。

回答by zack999

I would like to mention that Node.js has a nice thing called Debugger.

我想提一下 Node.js 有一个很好的东西叫做 Debugger。

Super short tutorial:

超短教程:

  1. is to run your app like this:
  1. 是这样运行你的应用程序:

node debug appname.js

node debug appname.js

  1. instead of the usual
  1. 而不是通常的

node appname.js

node appname.js

Do yourself a favor see: https://nodejs.org/api/debugger.htmlI posted this because I found lots of ways to do this that require dependancies before I found the debugger tool!

帮自己一个忙,请参阅:https: //nodejs.org/api/debugger.html我发布此信息是因为在找到调试器工具之前,我发现了很多需要依赖项的方法来执行此操作!