JavaScript & Node.js オンライン実行
ブラウザベースのCLIでJS/Node.jsコードをリアルタイム実行。セットアップ不要で、テストやデバッグ、学習に最適です。
📚 今すぐ始めたい人気のJavaScript/Node.jsコース
Loading...
⚡ この JavaScript(Node.js)オンライン実行ツールについて
CodeUtility JavaScript Executor は、ブラウザ上で最新の JavaScript コードを、 セットアップ不要ですぐに実行できるツールです。実際の Node.js 環境でサンドボックス化されたコンテナ内にて安全に実行し、 16、18、20 の各バージョンに対応しています。
Node.js のスニペットのテスト、ES6+ 構文の確認、ループ・関数・配列・Promise・async/await といった JavaScript の基本概念の学習に最適です。
アルゴリズムの検証や小さなスクリプトのデバッグ、実行時ロジックの試行にも使えます。ローカルに Node をインストールせずに済むので、 学習者、バックエンド開発者、ブラウザだけで素早く JavaScript を実行したい方にぴったりです。
💡 使い方
- 1. エディタ上部のドロップダウンから Node.js のバージョン(16、18、20)を選択します。
- 2. エディタに直接 JavaScript コードを記述するか、貼り付けます。
- 3. 実行 をクリックすると、下のコンソールに結果がすぐ表示されます。
- 4. 実行中は 停止 ボタンが表示され、クリックすると早期終了できます。
- 5. コード修正 を使うと、一般的な構文やインデントの誤りを自動で修正できます。
- 6. 修正後は 修正履歴 ボタンが表示されます — クリックすると直近の修正を確認できます。
- 7. ローカルファイルを アップロード したり、現在のスクリプトを ダウンロード することもできます。
- 8. すべてのユーザー間での効率と公正な利用のため、各実行は 20 秒 に制限されています。
🧠 ヒント: Node.js ランタイムは最新の ECMAScript 機能に対応しています — 非同期コード、モジュール、JSON パースをリアルタイムで試すのに最適です。
💡 初心者向け Node.js 基本ガイド
1. 変数と定数の宣言
let または const はブロックスコープの変数用です。const は定数に使います。
let x = 10;
const PI = 3.14;
let name = "Alice";
let isActive = true;
2. 条件分岐(if / switch)
制御フローには if、else if、else、switch を使います。
let x = 2;
if (x === 1) {
console.log("1");
} else if (x === 2) {
console.log("2");
} else {
console.log("その他");
}
switch (x) {
case 1:
console.log("1");
break;
case 2:
console.log("2");
break;
default:
console.log("その他");
}
3. ループ
データの反復処理には for、while、forEach を使います。
for (let i = 0; i < 3; i++) {
console.log(i);
}
let n = 3;
while (n > 0) {
console.log(n);
n--;
}
4. 配列
配列は順序付きの値のリストを保持します。インデックスでアクセスします。
let fruits = ["apple", "banana", "cherry"];
console.log(fruits[0]);
console.log(fruits.length);
5. 配列操作
push、pop、slice、reverse などのメソッドを使います。
fruits.push("kiwi");
fruits.pop();
console.log(fruits.slice(0, 2));
console.log(fruits.reverse());
let squares = [1, 2, 3, 4, 5].map(x => x * x);
console.log(squares);
6. コンソール入出力
出力には console.log を、入力には readline モジュールを使います。
const readline = require('readline');
const rl = readline.createInterface({
input: process.stdin,
output: process.stdout
});
rl.question("お名前は? ", name => {
console.log(`こんにちは、${name}`);
rl.close();
});
7. 関数
関数は宣言または関数式で定義できます。モダンな JavaScript ではアロー関数がよく使われます。
function greet(name) {
return `こんにちは、${name}`;
}
const add = (a, b) => a + b;
console.log(greet("Alice"));
console.log(add(2, 3));
8. オブジェクト(マップ)
オブジェクトはキーと値の組を保持します。辞書やマップに似ています。
let person = { name: "Bob", age: 25 };
console.log(person.name);
console.log(person["age"]);
// ES6 の Map
const map = new Map();
map.set("a", 1);
console.log(map.get("a"));
9. 例外処理
try、catch、finally を使って安全にエラー処理します。
try {
throw new Error("問題が発生しました");
} catch (e) {
console.log(e.message);
} finally {
console.log("必要なら後処理");
}
10. ファイル入出力
Node.js の fs モジュールでファイルの読み書きを行います。
const fs = require("fs");
fs.writeFileSync("test.txt", "Hello File");
const data = fs.readFileSync("test.txt", "utf8");
console.log(data);
11. 文字列操作
trim()、toUpperCase()、replace()、split() などを使います。
let text = " Hello World ";
console.log(text.trim());
console.log(text.toUpperCase());
console.log(text.replace("Hello", "Hi"));
console.log(text.split(" "));
12. クラスとオブジェクト
ES6+ は class 構文で OOP をサポートします。
class Person {
constructor(name) {
this.name = name;
}
greet() {
return `こんにちは、私は ${this.name} です`;
}
}
const p = new Person("Alice");
console.log(p.greet());
13. 参照
JavaScript のオブジェクトや配列は参照で渡されます。
function update(arr) {
arr.push("changed");
}
let data = ["original"];
update(data);
console.log(data); // ["original", "changed"] になる