【问题标题】:Best ways to develop painlessly in Javascript on a local machine在本地机器上用 Javascript 轻松开发的最佳方法
【发布时间】:2011-04-06 13:12:43
【问题描述】:

我对使用 Javascript 还是很陌生。

在大多数语言中,您可以在本地机器上快速运行代码。据我所知,在 JS 中,您通常只能通过浏览器使用它,因此我一直在上传我的代码并在浏览器中查看其效果。事实证明,这非常令人厌烦。另外,如果我犯了一个错误,我的 JS/JQuery 似乎什么都不做,而不是给我一个有用的错误消息,这使得编码变得非常缓慢。

是否有某种方法可以在本地运行 JS 以查看它在我运行时是否正常工作?然后只有在我大部分完成时才将其上传到网络上?我有什么方法可以做到这一点?我有什么方法可以在本地对 Javascript 进行单元测试?假设我有一些 JAML 应该呈现为 <p>HI</p>,如何在单元测试中本地运行它?

感谢您的帮助, 亚历克斯

编辑:

感谢所有伟大的建议。我得花点时间仔细研究一下,看看哪些对我的情况最有帮助。

【问题讨论】:

    标签: javascript unit-testing testing


    【解决方案1】:

    由于您使用的是 jQuery,我假设您实际上想要操作页面上的各种元素。因此,根据您的特定开发环境,每次上传它可能是无论如何都要走的路。如果您可以在本地计算机上设置开发环境(并非总是可能),那么就去吧。

    作为您问题的实际答案,我建议使用 Chrome 的开发人员工具,它不仅有控制台,还有一个元素检查器和一个资源跟踪器(资源跟踪器在使用 JSON 和 AJAX 时非常宝贵,因为它无效json 会静默失败)

    据我所知,firefox 的 firebug 插件(我自己不要使用)具有类似的功能集,所以如果您对它更满意,请使用它。

    请记住,作为开发人员,您的开发(和调试)环境与您正在编写的代码一样重要。

    编辑:注意到您提到了单元测试。有几个用于 JS 的单元测试框架,包括一个与 firebug 集成的框架,称为FireUnit。如果需要,可以快速谷歌搜索以找到更多信息。

    【讨论】:

      【解决方案2】:

      您无需将 JS 文件上传到服务器进行测试。只需编写一个html并声明js绑定

      <script
                  src="js/yourJSFile.js"
                  type="text/javascript"></script>
      

      在您喜欢的编辑器中编辑 JS 文件,然后刷新页面进行测试。

      对于单元测试,最好的选择是Selenium。它允许您记录与浏览器的交互,然后回放。

      【讨论】:

        【解决方案3】:

        您可以在 Firefox 中使用Firebug 来调试 JS,Google Chrome 内置了一个调试器(使用工具 -> 开发者工具菜单)。

        【讨论】:

        • 我同意,Firebug 是要走的路。
        • 据我所知,您无法使用库存版本的 Firebug 进行单元测试,这是 OP 所要求的。
        • “有什么方法可以在本地运行 JS 以查看它在我运行时是否正常工作?” - 是的,萤火虫/铬。他还问了关于单元测试的问题,我没有回答这部分问题,我也没有声称。
        【解决方案4】:

        您可以在浏览器中从您机器上的本地文件运行 Javascript,因此您可以跳过上传步骤。

        另外,我建议使用 Firefox/Firebug 组合来开发 Javascript,因为它非常方便,尤其是对于您提到的关于看不到代码问题的部分。

        【讨论】:

          【解决方案5】:

          即使您上传了 javascript,只要您访问调用它的网页,它就会立即下载给您。它始终运行客户端。因此,如其他人所说,坚持使用本地并使用萤火虫。谷歌的开发者工具也不错。

          【讨论】:

            【解决方案6】:

            如果您在浏览器中打开开发者工具,请按照以下步骤操作:

            1) 导航到来源

            2) 在sources下,点击sn-p,打开run.js

            3) 您可以使用 run.js 编写任意数量的代码并在本地运行它,以查看您的代码是否正常工作(它会在控制台上为您提供输出)

            4) 您还可以习惯一些键盘快捷键,以使其更快。

            5) 对于小的 javascript 代码,您可以导航到控制台并在那里运行您的代码

            【讨论】:

            • 我认为你的意思是 > 2) 在“Sources”下,选择“Snippets”选项卡并右键单击以创建新的 sn-p
            • 另请注意,Chrome 开发工具 sn-ps 保存在“浏览器中”(不是您可以提交到源代码控制的文件)并且不会通过您的 Google 帐户同步,因此它们是特定于您编写它们的浏览器/计算机。
            【解决方案7】:

            如果您想使用 Javascript 进行单元测试,可以使用 Firebug 的扩展来帮助您。我没有尝试过任何一个,所以我不能告诉你哪个值得考虑,但是如果你在谷歌上搜索关键字"Firebug unit testing",你可以很容易地找到它们。

            似乎最重要的是FireUnit。你可以找到一些关于它是如何工作的信息here

            【讨论】:

              【解决方案8】:

              考虑Spider Monkey,它是一个独立于浏览器的javascript 引擎。如果您正在开发的内容不涉及渲染到网页或可以与渲染代码分离(好习惯!),那么这可能很有用。

              【讨论】:

                【解决方案9】:

                我更喜欢 Chrome 而不是 Firefox,我刚刚找到了 Web Server for Chrome

                它只是一个 Google 应用程序,可以快速为您设置一个网络服务器,并将在您登录 Chrome 的任何地方进行设置。它只允许文件访问您当前的设备,或者如果您指定,则仅允许当前 LAN 上的其他设备。

                您只需将其指向包含您的 index.html 文件的目录,然后在浏览器中输入 http://127.0.0.1:8887

                【讨论】:

                  【解决方案10】:

                  除了给出的答案之外,您还可以使用 Jasmine 进行自动化测试。


                  Evan Hahn 提供了一个 tutorial ,似乎有助于开始对 Jasmine 进行自动化测试。
                  我用过它,对我来说它就像一个魅力。特别是如果您要进行测试驱动开发!

                  【讨论】:

                    猜你喜欢
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 1970-01-01
                    • 2012-03-09
                    • 1970-01-01
                    相关资源
                    最近更新 更多