我怎样才能debugging我的JavaScript代码？
当我发现我有一个有问题的代码片段时，我应该如何去debugging它？
Firebug是最受欢迎的工具之一。
所有现代浏览器都带有某种forms的内置JavaScriptdebugging应用程序。 这些细节将在相关的技术网页上介绍。 我个人喜欢debuggingJavaScript是Firefox中的Firebug 。 我并不是说萤火虫比其他的都好， 这取决于你的个人喜好，你也许应该在所有浏览器中testing你的网站，但是我的第一个，个人首选总是Firebug。
我将使用Firebug作为例子来介绍下面的一些高级解决scheme：
火狐
Firefox自带内置的JavaScriptdebugging工具，但是我build议你安装Firebug add。 这提供了几个基于基本版本的附加function，方便。 我只会在这里谈论Firebug。
一旦安装了Firebug，你可以像下面这样访问它：
首先，如果你右键点击任何元素，你可以用Firebug检查元素 ：
点击这个将打开浏览器底部的Firebug面板：
Firebug提供了几个function，但感兴趣的是脚本标签。 点击脚本标签打开下面的窗口：
显然，要debugging你需要点击重载 ：
现在，您可以通过单击要添加断点的JavaScript代码片段左侧的行来添加断点：
当你的断点被击中时，它将如下所示：
您也可以添加监视variables，并且通常在现代debugging工具中执行您所期望的一切。
有关Firebug提供的各种选项的更多信息，请查看Firebug常见问题解答 。
铬
Chrome也有自己的内置的JavaScriptdebugging选项，其工作方式非常类似， 右击，查看元素等 。 看看Chrome开发者工具 。 我通常会发现Chrome中的堆栈跟踪比Firebug更好。
IE浏览器
如果您使用.NET进行开发并使用Web开发环境使用Visual Studio，则可以通过放置断点等来直接debuggingJavaScript代码。您的JavaScript代码看起来与您正在debuggingC＃或VB.NET代码完全相同。
如果你没有这个，Internet Explorer也提供了上面所示的所有工具。 令人烦恼的是，您可以通过按F12访问开发人员工具，而不必使用Chrome或Firefox的右键单击检查元素function。 这个问题涵盖了大部分要点。
- Internet Explorer 8（开发人员工具 – F12 ）。 其他任何东西在Internet Explorer的土地上都是二stream的
- Firefox和Firebug 。 按F12键显示。
- Safari（显示菜单栏， 首选项 – > 高级 – > 显示开发菜单栏）
- Google Chrome JavaScript控制台（ F12或（ Ctrl + Shift + J ））。 大部分与Safari相同的浏览器，但Safari是更好的恕我直言。
- Opera（ 工具 – > 高级 – > 开发工具 ）
JavaScript中有一个debugging器关键字来debuggingJavaScript代码。 把debugging器; 在您的JavaScript代码片段。 它会自动开始debuggingJavaScript代码。
例如：
假设这是你的test.js文件
function func(){ //Some stuff debugger; //Debugging is automatically started from here //Some stuff } func(); - 当浏览器在启用debugging器的情况下运行开发人员选项中的网页时，它会自动从debugging器开始debugging; 点。
- 应该打开浏览器的开发者窗口。
我使用旧的好printf方法（一种古老的技术，在任何时候都能很好地工作）。
看魔术%o ：
console.log("this is %o, event is %o, host is %s", this, e, location.host);
%o转储可点击和深层浏览， JS对象的漂亮的内容。 只显示了%s 。
和这个：
console.log("%s", new Error().stack);
为您提供类似于Java的堆栈跟踪，以指向new Error()调用（包括文件path和行号 !!）。
Chrome和Firefox均提供%o和new Error().stack 。
有了这样强大的工具，你可以假设你的JS出了什么问题，把debugging输出（不要忘记包装在if语句来减less数据量）并validation你的假设。 解决问题或做出新的假设或把更多的debugging输出到位问题。
也用于堆栈跟踪使用：
console.trace();
就像说控制台
快乐的黑客！
从Firebug和IEdebugging器开始。
尽pipeJavaScript中的debugging器要小心。 每过一段时间，他们都会影响环境，足以导致您尝试debugging的一些错误。
例子：
对于Internet Explorer，它通常是一个渐进的放缓，是一种内存泄漏types的交易。 半小时左右后，我需要重新启动。 这似乎相当规则。
对于Firebug来说，这可能已经超过一年了，所以它可能是一个更老的版本。 因此，我不记得具体细节，但基本上代码运行不正确，并试图debugging一段时间后，我禁用Firebug和代码工作正常。
虽然alert(msg); 在那些“我只是想知道发生了什么事情”的场景下工作…… 每个开发者都遇到过这样的情况，你最终会陷入一个无法摆脱的（非常大或无尽的）循环。
我build议在开发过程中，如果你想要一个非常正面的debugging选项，使用一个debugging选项，让你分手。 （PS Opera，Safari？和Chrome？在它们的本机对话框中都有这个function）
//global flag _debug = true; function debug(msg){ if(_debug){ if(!confirm(msg + '\n\nPress Cancel to stop debugging.')){ _debug = false; } } }
通过上述操作，您可以将自己置于一个popup式debugging的大循环中，按Enter / Ok可以跳过每条消息，但按Escape / Cancel可以让您很好的分离出来。
我使用WebKit的开发者菜单/控制台（Safari 4）。 这与Firebug几乎相同。
console.log()是新的黑色 – 比alert()更好。
我的第一步是始终validationHTML并使用JSLint检查语法。 如果你有干净的标记和有效的JavaScript代码，那么是Firebug或其他debugging器的时候了。
Visual Studio 2008有一些非常好的JavaScriptdebugging工具。 您可以在您的客户端JavaScript代码中放置一个断点，并使用与服务器端代码完全相同的工具逐步完成。 没有必要附加到一个进程或做任何棘手的事情来启用它。
我使用一些工具： 提琴手 ，Firebug和Visual Studio。 我听说Internet Explorer 8有一个很好的内置debugging器。
我曾经使用Firebug ，直到Internet Explorer 8出来。 我不是Internet Explorer的忠实粉丝，但是花费了一些时间与内置的开发人员工具（其中包括一个非常好的debugging器）之后，使用其他任何东西似乎毫无意义。 我必须向微软倾诉他们，他们在这个工具上做了很棒的工作。
你也可以看看YUI Logger 。 所有你需要做的就是在你的HTML中包含一些标签。 这是一个有益的除了萤火虫，这是或多或less必须的。
我发现新版本的Internet Explorer 8（按F12 ）非常适合debuggingJavaScript代码。
当然，如果你使用Firefox， Firebug也不错。
除了使用Visual Studio的JavaScriptdebugging器，我还写了一个我自己的简单的面板，包含在一个页面中。 这就像Visual Studio的“ 立即”窗口一样。 我可以改变我的variables的值，调用我的函数，并查看variables的值。 它只是评估在文本字段中编写的代码。
我正在使用Venkman ，一个用于XUL应用程序的JavaScriptdebugging器。
除了Firebug和浏览器本地开发人员扩展JetBrains WebStorm IDE还带有内置Firefox和Chrome （需要扩展）的远程debugging支持 。
还支持：
- coffescript： 如何使用webstorm 6源地图debuggingnode.js中的coffeescript
- 的node.js
免费testing的选项是30试用版或使用Early Access版本 。
如果你正在使用Visual Studio ，只需要debugger; 在你要debugging的代码上面。 在执行期间，控件将在那个地方暂停，并且可以从那里一步一步地进行debugging。
与大多数答案一样，这取决于：你在debugging时想达到什么目的？ 基本开发，修复性能问题？ 对于基本的发展，所有以前的答案是绰绰有余的。
特别是对于性能testing，我推荐Firebug。 能够描述哪些方法在时间上最昂贵，对于我已经开展的一些项目来说是非常宝贵的。 随着客户端库变得越来越健壮，更多的责任被放置在客户端，这种types的debugging和分析只会变得更有用。
Firebug控制台API： http ： //getfirebug.com/console.html
通过按F12网页开发人员可以快速debuggingJavaScript代码，而无需离开浏览器。 它内置于Windows的每个安装中。
在Internet Explorer 11中 ， F12工具提供诸如断点，监视和局部variables查看等debugging工具，以及用于消息和即时代码执行的控制台。
