简单的JavaScript IDE

时间:2013-06-16 11:00:05

标签: javascript ide

我是JavaScript新手,我想使用简单的基于Windows的IDE练习我的技能。在学习的同时我不想使用任何CSS或HTML。我想尽可能有单色步进,突出显示和语法检查。

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

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

squareNumber(5)

25

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

5 个答案:

答案 0 :(得分:10)

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

答案 1 :(得分:8)

看一下,

  • WebStorm:真正的JavaScript IDE(可能是最好的。)
  • Sublime Text 2:带语法突出显示的文本编辑器,以及安装插件的可能性。

您可以使用任一软件和node.js来获得所需内容。

执行文件

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

console.log(squareNumber(5));

将输出node.js,

25

答案 2 :(得分:0)

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

http://brackets.io/

微软还提供免费产品,Visual Studio 2015也称为“Visual Studio Code”,也可以在Mac和Linux上运行。只使用它一天,但它在我的低功耗平板电脑上运行良好。

https://code.visualstudio.com/

答案 3 :(得分:0)

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

1) Firefox开发者版-ScratchPad

Firefox开发者版浏览器提供了一个良好的控制台,其中包含编写JavaScript的所有必需功能。

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

如您在下面看到的那样,它具有语法颜色,甚至还有直接从计算机保存和打开文件的选项。 enter image description here

您可以使用快捷方式- SHIFT + F4

将Firefox ScratchPad作为独立窗口打开。

enter image description here

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

键盘快捷键

CTRL + L-显示所选代码

CTRL +空格-代码提示

CTRL + R-运行命令

CTRL + I-检查命令

2) 节点CMD或CMD +节点

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

enter image description here

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

您可以通过单击顶部栏并选择属性 背景颜色和文本颜色。 >

enter image description here

要在使用节点时在Node上进行语法着色,可以添加如下所示的语法着色npm软件包之一:

enter image description here

我通过以下四个步骤安装了 cli-color npm软件包

1)检查是否使用nmp -v

安装了npm

2)使用npm install <name of package>

安装首选软件包

3)包括软件包

4)测试程序包并查看结果

注意:重要的是要检查每个软件包的文档,尤其是用法,因为可能会有所不同。

这是我最喜欢的两个Node.js语法突出显示包:

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

答案 4 :(得分:0)

我在 Vim 中编程并希望为 JavaScript IDE 提供一些轻量级的东西。我创建了一个简单的 HTML 页面,其中包含指向我在 Vim 中编辑并在 Firefox Developer Tools 中呈现的 .js 文件的链接(F12,来自 HTML 页面打开;Shift-Ctrl-R 重新加载)。

js_ide.html

<!DOCTYPE html>
<!-- vim: set filetype=html : -->
<!-- /mnt/Vancouver/programming/javascript/js_ide.html -->

<html encoding="UTF-8" charset="UTF-8" lang="en-US" language="English" xmlns="https://www.w3.org/1999/xhtml/" itemtype="http://schema.org/WebPage">

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=0.1">

<title>JavaScript IDE</title>

<script src="/mnt/Vancouver/programming/javascript/js_ide.js" type="text/javascript" charset="utf-8" /></script>
</head>

<body>
<h1>JavaScript IDE</h1>

<p>Open this file, <a href="/mnt/Vancouver/programming/javascript/js_ide.html">/mnt/Vancouver/programming/javascript/js_ide.html</a>, in Firefox and open the Firefox Developer Tools ("console", F12).</p>

<p>Edit JavaScript code in associated file <a href="/mnt/Vancouver/programming/javascript/js_ide.js">/mnt/Vancouver/programming/javascript/js_ide.js</a></p>

<hr>
</body>
</html>

js_ide.js

// vim: set ft=javascript:
// /mnt/Vancouver/programming/javascript/js_ide.js
/* ========================================================================= */

let q = 'apple banana "nova scotia" "british columbia"';

// https://stackoverflow.com/questions/12367126/how-can-i-get-a-substring-located-between-2-quotes
const r = q.match(/"([^']+)"/g);
console.log('r:', r)
// etc.

截图

simple_javascript_ide