我在C / C ++ / Objective-C方面非常有经验，过去几天一直在尝试html / css / JS，我发现它非常令人沮丧。
一次又一次我被抓住了，因为我因为复制/粘贴等而导致语法错误或未声明的变量，结果是代码突然停止工作然后我不得不划伤头脑找出原因。
最痛苦的事情是在代码中使用警报，一切都失败，以便找出原因。我知道有一个新的控制台对象用于记录，但它似乎不适用于Komodoedit或jsFiddle？这就是我一直在使用的。
有没有办法使用这些工具或替代工具，我可以在调试器中逐行浏览代码，就像我可以使用其他语言一样？或者除了jslint之外，还可以在执行代码之前轻松检测代码问题的任何技巧？
[我不想使用任何可能内置支持日志记录的库，因为我发现它们（JQuery / JQuery移动设备好）会大大减慢iPhone的加载时间，所以想要专注于纯JS。]
[我的目标浏览器只是iOS，但我大部分时间都在使用Komodoedit，每隔几个小时在iPhone上试用一次]
由于
答案 0 :(得分：5)
您需要多种工具。
首先，让自己成为一个真正的调试器。我使用Chrome内置的一个。 Safari和Firebug中内置了类似的内容，可作为Firefox的附加组件使用。这将允许您设置断点并逐步执行代码，并确切了解正在发生的事情。
第二次，非常习惯通过jsLint运行代码。这将向您展示许多明显的拼写错误，并鼓励您从第一天开始编写健壮的代码。
第三次，开始以strict模式书写。这将再次阻止一些明显的拼写错误并迫使你开始养成一些好习惯。
第四次，在需要时使用console.log()。一旦有了调试器，它的输出就会显示在调试器的调试控制台中，用于浏览器中的任何页面，包括jsFiddle页面。您将不得不在jsFiddle中的右框架上调用调试器，然后它将正常工作。我一直使用常规调试器和console.log() jsFiddle。在jsFiddle和调试器中需要花点时间来找到自己的代码设置断点的位置，但是一旦找到它，它就很容易使用。
第五，javascript根本就不是C ++。虽然语法看起来很熟悉，但使用匿名函数和闭包以及对象和原型执行操作的方式却截然不同。作为一个在学习javascript之前用C ++编程很多年的人，我非常感谢我现在可以在javascript中用C ++做更多工作，但是我需要一段时间才能让我的大脑进入一种新的思维模式。我在javascript开发的第一年花了太多时间试图模仿C ++技术，而不仅仅是学习在javascript中实现目标的更好方法。
第六，由于缺少可为您找到错误的编译器，您必须更改编写和测试代码的方式。我记得在C ++时代，当我需要重构某些东西时，我可以进行一些更改，然后让编译器找到我需要修复语法的所有其他地方。你不能用javascript做到这一点。当您进行批量更改时，您可以通过jsLint运行以查找某些问题，然后您确实需要执行每个路径以确保一切正常。这有点痛苦。
第七，找到单元测试的策略/工具。一旦项目获得了多个函数，您将从构建单元测试中受益匪浅，您可以在任何时候进行重大更改时运行。他们会在没有单元测试的情况下在很短的时间内为您找到问题，当您看到需要时，他们会给您勇气重构和清理代码，因为您知道单元测试会告诉您是否所有内容都是再次工作。这是额外的工作，可以在未来多次支付红利。
答案 1 :(得分：0)
Firefox有一个名为FireBug的插件，它非常适合调试CSS / javascript，是的，它确实能够逐步执行脚本以及命令行，您可以尝试各种javascript表达式。我非常确定Chrome有类似功能。
答案 2 :(得分：0)
这篇文章中提供了调试javascript的工具列表 advance-javascript-debugging-techniques
答案 3 :(得分：0)
由于您使用的是Chrome，因此您只需打开开发者控制台（扳手 - ＆gt;工具 - ＆gt; javascript控制台，或Ctrl + Alt + J（猜测））。您可以使用console.log，console.error和console.info打印警报，而不是使用警报信息。所有这些都是可变的，所以你可以根据需要传递一个电话。
除此之外，您还可以使用控制台动态测试和修改部分代码，或者只是尝试一些代码段以查看它们是否有效。它是一个功能齐全的REPL，也适用于当前文档。
在开发者控制台的来源标签中，您可以设置断点并逐步执行代码，分析每个点的状态。这个页面详细介绍了它：http://chromedevtools.googlecode.com/svn-history/r421/trunk/tutorials/breapoints/index.html
在元素标签中，您可以对DOM中元素的更改设置断点，包括对属性和子节点的更改。右键单击节点，然后选择所需的选项。在调试异步代码并与文档一起播放时（例如，AJAX调用插入新内容），这将派上用场。
除此之外，您还可以滚动到右侧样式窗格的底部，然后打开事件侦听器部分。在这里，您可以检查绑定到所选DOM节点的所有事件。
您可以在代码中输入debugger（不带分号），然后它会打开源标签，以便您可以进一步检查代码。我认为这可能是针对Chrome的。
最后，像JSlint这样的工具将帮助您在编码时发现未声明的变量，以及代码格式化会产生意外错误的情况，有些甚至可能会使用语法突出显示使您注意到变量未定义。
这也只是刮擦表面。您的编辑器和JSlint可以使您的代码看起来并且无错误地解析，但浏览器及其控制台是您将花费大部分时间的地方。