简单的 JavaScript IDE

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

Simple JavaScript IDE

javascriptide

提问by Nick Le Page

I am brand new to JavaScript and I would like practice my skills using a simple windows based IDE. While learning I do not want to use any CSS or HTML. I would like if possible to have colour single stepping, highlighting and syntax checking.

我是 JavaScript 的新手,我想使用基于 Windows 的简单 IDE 来练习我的技能。在学习时,我不想使用任何 CSS 或 HTML。如果可能的话,我希望有颜色单步、突出显示和语法检查。

So for example you could type in your function(s), call it and receive the result

例如,您可以输入您的函数,调用它并接收结果

function squareNumber(x) {
  return x*x;
}

squareNumber(5)

25

I would like something better than the Internet Explorer console.

我想要比 Internet Explorer 控制台更好的东西。

采纳答案by Nick Le Page

Ended up using this IDE as I could run it on a low powered Laptop. Free Version

最终使用此 IDE,因为我可以在低功率笔记本电脑上运行它。免费版

http://brackets.io/

http://brackets.io/

There is also a free offering from Microsoft with Visual Studio 2015 called "Visual Studio Code" runs on Macs and linux too. Only used it for a day but it work great on my low powered tablet.

Microsoft 还提供了一个免费产品,带有 Visual Studio 2015,称为“Visual Studio Code”,也可在 Mac 和 linux 上运行。只使用了一天,但它在我的低功率平板电脑上运行良好。

https://code.visualstudio.com/

https://code.visualstudio.com/

回答by Niccolò Campolungo

There are a lot of good online IDEs at the moment. One of my favorites is JSFiddle, but you said you don't want to use CSS and HTML so it's superfluous in this case. You can use JSBin, opening only the Javascript and Console panels. Another very good one is, in my opinion, Ideone, which has a lot of languages(for JS you have to select Javascript Spidermonkey). The last one I suggest you is JSConsole, from the creator of JSBin, which is basically an enhanced Javascript console(as the name states).

目前有很多不错的在线IDE。我最喜欢的一个是JSFiddle,但你说你不想使用 CSS 和 HTML,所以在这种情况下它是多余的。您可以使用JSBin,只打开 Javascript 和 Console 面板。在我看来,另一个非常好的是Ideone,它有很多语言(对于 JS 你必须选择 Javascript Spidermonkey)。我建议您使用的最后一个是JSConsole,来自 JSBin 的创建者,它基本上是一个增强的 Javascript 控制台(正如名称所述)。

回答by Belema

Have a look at either,

看一看,

  • WebStorm: real JavaScript IDE (possibly the best.)
  • Sublime Text 2: text editor with syntax highlighting, and possibility to install plugins.
  • WebStorm:真正的 JavaScript IDE(可能是最好的。)
  • Sublime Text 2:具有语法高亮和安装插件的可能性的文本编辑器。

You can use either software, together with node.js, to get what you want.

您可以将任一软件与node.js一起使用,以获得您想要的。

Executing the file,

执行文件,

function squareNumber(x) {
    return x * x;
}

console.log(squareNumber(5));

with node.js will output,

与 node.js 将输出,

25

回答by NJENGAH

Besides the options listed in the answers above; these are additional options I use when I need to write/test JS without HTML/CSS :

除了上面答案中列出的选项;这些是我需要在没有 HTML/CSS 的情况下编写/测试 JS 时使用的附加选项:

1)Firefox Developer Edition - ScratchPad

1) Firefox 开发者版 - ScratchPad

The Firefox Developer Edition browser offers a good console with all the necessary features to write JavaScript.

Firefox Developer Edition 浏览器提供了一个很好的控制台,其中包含编写 JavaScript 所需的所有功能。

To cite a specific feature - ScratchPad provides you with a good option to write JS code and you can use the run button to view it on the console.

引用特定功能 - ScratchPad 为您提供了编写 JS 代码的好选择,您可以使用运行按钮在控制台上查看它。

As you can see below it has the syntax coloring and even the options to save and open files directly from your computer. enter image description here

正如您在下面看到的那样,它具有语法着色,甚至可以直接从您的计算机保存和打开文件的选项。 在此处输入图片说明

You can open the Firefox ScratchPad as an independent window using the shortcut - SHIFT+F4

您可以使用快捷键SHIFT+F4作为独立窗口打开 Firefox ScratchPad

enter image description here

在此处输入图片说明

It features code completion, inline documentation and much more, you can learn more about using it from the official documentation here - https://developer.mozilla.org/en-US/docs/Tools/Scratchpad

它具有代码完成、内联文档等功能,您可以从此处的官方文档中了解有关使用它的更多信息 - https://developer.mozilla.org/en-US/docs/Tools/Scratchpad

Keyboard Shortcuts

键盘快捷键

CTRL + L - To display selected code

CTRL + L - 显示选定的代码

CTRL + SPACE - Code Hinting

CTRL + 空格 - 代码提示

CTRL + R - Run Command

CTRL + R - 运行命令

CTRL + I - Inspect Command

CTRL + I - 检查命令

2)Node CMD or CMD + Node

2)节点CMD或CMD+节点

I also like using node + CMD since they work seamlessly. For this option, you need to install node.js and use the CMD to write and test your JS code.

我也喜欢使用 node + CMD,因为它们可以无缝工作。对于此选项,您需要安装 node.js 并使用 CMD 编写和测试您的 JS 代码。

enter image description here

在此处输入图片说明

You can also consider using the node.js CMD that works like the windows CMD.

您还可以考虑使用与 windows CMD 类似的 node.js CMD。

You can change the background colorand the text colorof the Node CMD by clicking on the top bar and choosing properties

您可以通过单击顶部栏并选择属性来更改节点 CMD的背景颜色文本颜色

enter image description here

在此处输入图片说明

For syntax coloring on Node when using node, you can add one of the syntax coloring npm packages as illustrated below :

对于使用 node 时 Node 上的语法着色,您可以添加语法着色 npm 包之一,如下所示:

enter image description here

在此处输入图片说明

I installed the cli-color npm packagein these four steps :

我在这四个步骤中安装了cli-color npm 包

1)Check if npm is installed using the nmp -v

1)检查 npm 是否安装使用nmp -v

2)Install your preferred package using npm install <name of package>

2)使用安装您的首选软件包npm install <name of package>

3)Include the package

3)包含包

4)Test the package and view the results

4)测试包并查看结果

NOTE: It important to check out the documentation of each package esp on the usage since there may be differences.

注意:检查每个包的文档尤其是关于用法的文档很重要,因为可能存在差异。

These are two of my favorite Node.js syntax highlighting packages :

这是我最喜欢的两个 Node.js 语法高亮包:

https://www.npmjs.com/package/cli-colorand https://www.npmjs.com/package/cli-highlight

https://www.npmjs.com/package/cli-colorhttps://www.npmjs.com/package/cli-highlight