Bevor man tief in Sprache und Standardbibliothek einsteigt, lohnt eine kurze Inventur: Wo läuft JavaScript heute eigentlich, und wie bringt man eine Zeile Code möglichst schnell zur Ausführung? Dieser Artikel zeigt die drei wichtigsten Wege — die Browser-Console, die Node-REPL und das klassische Skript per node datei.js — und ordnet sie didaktisch ein. Dazu kommen die Unterschiede zwischen ES Modules und CommonJS in Node, ein knappes Setup für VS Code und ein Überblick über die wichtigsten Online-Spielwiesen für 2026.
Drei Wege im Überblick
Für den Einstieg gibt es genau drei Umgebungen, die man kennen sollte: die Browser-Console, die interaktive Node-REPL und ein vom Terminal aus gestartetes Skript. Alle drei sprechen denselben Sprachkern, unterscheiden sich aber in Persistenz, verfügbaren APIs und Reibung beim Wechsel zwischen Iterationen.
| Umgebung | Stärken | Grenzen |
|---|---|---|
| Browser-Console | DOM, sofortiges Feedback, Web-APIs | Kein Datei-System, kein Modul-Import |
| Node-REPL | Top-Level await, Tab-Completion, FS-Zugriff | State geht beim Beenden verloren |
node datei.js | Reproduzierbar, versionierbar, testbar | Kein interaktives Probieren |
In der Praxis nutzt man alle drei parallel: die Browser-Console für UI- und DOM-Fragen, die REPL als Taschenrechner und Spielwiese, eine Datei für alles, was reproduzierbar bleiben soll.
Die Browser-Console
Die DevTools öffnen sich überall mit F12 oder — auf macOS — mit Cmd+Opt+I. Im Tab Console lässt sich beliebiger JavaScript-Code eintippen; mit Enter wird er ausgewertet, der Rückgabewert direkt darunter angezeigt. Mehrzeilige Eingaben gelingen mit Shift+Enter; ein automatischer Zeilenumbruch wird auch gesetzt, sobald ein Block syntaktisch noch nicht abgeschlossen ist.
const greet = name => `Hallo, ${name}!`;
greet('Welt');'Hallo, Welt!'Drei Komfort-Funktionen sind erwähnenswert. Erstens: das Häkchen Preserve log lässt Console-Einträge auch nach einem Reload überleben — praktisch beim Debuggen von Redirects. Zweitens funktioniert in modernen Engines (Chrome, Firefox, Safari) Top-Level await direkt in der Console. Drittens stellt die Console mit $0 bis $4 einen Verlauf der zuletzt im Elements-Panel selektierten Knoten bereit, und $_ enthält stets den letzten Rückgabewert.
const res = await fetch('/api/health');
const data = await res.json();
data.status;'ok'Node.js installieren
Für alles abseits des Browsers braucht es eine lokale Runtime. Empfohlen ist Node.js 22 LTS — die aktive LTS-Linie wird bis Mai 2027 mit Sicherheits-Updates versorgt. Statt Node global per Installer einzurichten, lohnt sich der Umweg über einen Versions-Manager: er erlaubt projektgenaue Wechsel und macht Upgrades schmerzfrei.
# nvm installieren (macOS / Linux)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
# aktuelle LTS holen und aktivieren
nvm install --lts
nvm use --lts
# Verifikation
node -v # v22.x.x
npm -vAuf macOS ist alternativ brew install node möglich, unter Windows hat sich fnm oder nvm-windows eingebürgert. Wer Bun oder Deno parallel nutzen möchte, installiert beide problemlos daneben — sie konkurrieren nicht mit Node, sondern erweitern den Werkzeugkasten.
Die Node-REPL
Ein nacktes node ohne Argument startet die Read-Eval-Print-Loop. Sie ist für die Sprache, was python interaktiv für Python ist: ein Skizzenblock zum Probieren von Ausdrücken, ohne eine Datei anzulegen.
$ node
Welcome to Node.js v22.14.0.
Type ".help" for more information.
> const xs = [1, 2, 3];
undefined
> xs.map(n => n * n);
[ 1, 4, 9 ]
> _
[ 1, 4, 9 ]
> .editor
// Mehrzeilig: zum Verlassen Ctrl+D
function square(n) {
return n * n;
}
square(7);
// Strg+D
49
> .save session.js
> .exitWichtige Befehle: .help listet alle Spezialkommandos, .editor öffnet einen Multi-Line-Modus, .save und .load schreiben oder lesen ganze Sessions als Datei, .clear setzt den Kontext zurück. Der Unterstrich _ enthält stets den letzten Rückgabewert — perfekt, um Zwischenergebnisse weiter zu verketten. Tab-Completion funktioniert auf Variablen, Properties und Modul-Namen.
Eine Datei mit Node ausführen
Sobald Code wiederverwendbar werden soll, wandert er in eine Datei. node datei.js reicht für den Einstieg; zwei zusätzliche Flags sind im Alltag Gold wert.
function greet(name) {
return `Hallo, ${name}!`;
}
const names = ['Anna', 'Bert', 'Clara'];
for (const n of names) {
console.log(greet(n));
}Hallo, Anna!
Hallo, Bert!
Hallo, Clara!node --watch hello.js (Node 19+, stabil seit Node 20) startet das Skript bei jeder Änderung an der Datei oder einer importierten Datei automatisch neu — ein kompletter Ersatz für nodemon aus dem Werkzeuggürtel. node --inspect-brk hello.js öffnet einen DevTools-kompatiblen Debug-Port; mit dem Aufruf chrome://inspect im Browser lässt sich die Datei dann mit Breakpoints durchsteppen.
node hello.js # einmalig ausführen
node --watch hello.js # Auto-Reload bei Änderungen
node --inspect-brk hello.js # Debug-Port + Breakpoint am Start
node --env-file=.env hello.js # .env-Datei laden (Node 20.6+)ES Modules vs. CommonJS
In Node existieren zwei Modul-Systeme nebeneinander. Das ältere CommonJS mit require und module.exports ist seit Node 0.x dabei und für .js-Dateien weiterhin Default, sofern nichts anderes konfiguriert ist. ES Modules mit import und export sind seit Node 12 produktionsreif, seit Node 22 die empfohlene Form für Neuprojekte und in .mjs-Dateien sowie bei "type": "module" in der package.json automatisch aktiv.
{
"name": "mein-projekt",
"version": "1.0.0",
"type": "module"
}Der gleiche Use-Case einmal in ESM, einmal in CommonJS — die strukturellen Unterschiede sind klar erkennbar:
// Datei-Endung mjs ODER package.json mit "type": "module"
export function add(a, b) {
return a + b;
}
export const PI = 3.14159;import { add, PI } from './math.mjs';
// Top-Level await ist in ESM erlaubt
const res = await Promise.resolve(add(2, 3));
console.log(res, PI);5 3.14159function add(a, b) {
return a + b;
}
module.exports = { add, PI: 3.14159 };const { add, PI } = require('./math.cjs');
console.log(add(2, 3), PI);
// Top-Level await ist in CommonJS NICHT erlaubt5 3.14159| Eigenschaft | CommonJS | ES Modules |
|---|---|---|
| Import | require() | import / dynamisches import() |
| Export | module.exports | export / export default |
| Datei-Endung (Default) | .cjs oder .js | .mjs oder .js mit "type": "module" |
| Top-Level await | nein | ja |
__dirname / __filename | direkt verfügbar | über import.meta.dirname |
| Datei-Endung im Import | optional | verpflichtend |
Quick-Start: das erste Skript
Vom leeren Verzeichnis bis zum laufenden Skript braucht es heute keine Build-Pipeline mehr. Drei Befehle, eine Datei.
mkdir hallo-js && cd hallo-js
npm init -y
# in package.json: "type": "module" ergänzen
echo 'console.log(`Hallo aus Node ${process.version}`);' > index.js
node index.jsHallo aus Node v22.14.0Wer schnell Top-Level await ohne package.json will, nutzt entweder die Datei-Endung .mjs oder das Flag --input-type=module für Inline-Code:
node --input-type=module -e "
const res = await fetch('https://api.github.com');
console.log(res.status);
"200Online-Spielwiesen
Wenn lokale Installation gerade keine Option ist — etwa beim Pair-Programming, im Workshop oder am fremden Rechner — gibt es 2026 mehrere ausgereifte Browser-Umgebungen.
- CodePen und JSFiddle sind klassische Frontend-Spielwiesen mit HTML/CSS/JS-Splitscreen, ideal für DOM-Experimente.
- CodeSandbox und StackBlitz bieten vollwertige Node-Container im Browser; StackBlitz nutzt dafür WebContainers, also ein WASM-Node, das ohne Server auskommt.
- Replit liefert eine vollwertige IDE inklusive Hosting und Datenbank — das Cloud-Pendant zu VS Code.
- Der Bun-Playground auf bun.com ist nützlich, um Bun-spezifische APIs ohne lokale Installation zu testen.
Für reine Sprach-Experimente ist die Browser-Console oft schneller als jede Online-IDE. Sobald aber package.json, mehrere Dateien oder Hot-Reload ins Spiel kommen, lohnt der Umstieg auf StackBlitz oder eine lokale Node-Installation.
Editor-Setup
VS Code ist der De-facto-Standard für JavaScript. Out of the box bringt es einen Node-Debugger, IntelliSense für Standardbibliothek und npm-Pakete sowie ein integriertes Terminal mit. Drei Erweiterungen lohnen den Tag-Eins-Aufwand: ESLint für statische Analyse, Prettier für konsistente Formatierung und Error Lens für inline angezeigte Fehler.
root = true
[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = trueEine .editorconfig im Projekt-Root sorgt dafür, dass Tab-Breite und Zeilenende über Editoren und Betriebssysteme hinweg gleich aussehen. Wer Type-Checks ohne TypeScript möchte, schreibt JSDoc-Kommentare und aktiviert in der jsconfig.json die Option "checkJs": true — VS Code zeigt dann die gleichen roten Schlangenlinien wie bei einem TS-Projekt, ohne dass eine .ts-Datei nötig wäre.
/**
* @param {string} name
* @param {number} [age]
* @returns {string}
*/
function describe(name, age) {
return age ? `${name} (${age})` : name;
}Häufige Fragen
Welche Node-Version sollte ich nutzen?
Für Production immer die aktuelle LTS-Linie — 2026 ist das Node 22 (Wartung bis Mai 2027). Für Experimente und neue Features lohnt parallel die jeweils aktuelle Major-Linie. Beides parallel installieren ist über nvm in Sekunden erledigt.
Wie wechsle ich zwischen Node-Versionen?
Auf macOS und Linux: nvm. Unter Windows: nvm-windows oder das schnellere, in Rust geschriebene fnm. Mit einer .nvmrc im Projekt-Root und nvm use wird die Version pro Projekt automatisch eingestellt.
Soll ich npm, yarn oder pnpm nutzen?
pnpm ist 2026 die schnellste Wahl: Content-Addressable-Storage spart Plattenplatz und Install-Zeit, der strikte Resolver verhindert Phantom-Dependencies. npm reicht für simple Projekte und ist überall vorinstalliert. yarn 4 bleibt eine ausgereifte Alternative mit Plug'n'Play-Modus.
Was ist der Unterschied zwischen .js und .mjs?
.mjs ist immer ESM, .cjs ist immer CommonJS. .js hängt vom Feld type in der nächstgelegenen package.json ab — fehlt es, behandelt Node die Datei als CommonJS.
Funktioniert TypeScript ohne Build-Tool?
Mit Node 22+ ja: node --experimental-strip-types datei.ts entfernt Typ-Annotationen zur Laufzeit ohne separaten Compile-Schritt. Deno und Bun führen TypeScript ohnehin nativ aus. Für komplexere Projekte bleibt tsc oder tsx aber die robustere Wahl.
Was tun bei „SyntaxError: Cannot use import statement outside a module“?
Node interpretiert die Datei gerade als CommonJS. Zwei schnelle Lösungen: entweder "type": "module" in die package.json eintragen oder die Datei in .mjs umbenennen. Beides aktiviert ESM und akzeptiert import.
Wie debugge ich Node-Code?
node --inspect-brk datei.js startet das Skript mit angehaltenem Debugger. In Chrome chrome://inspect öffnen, das Target erscheint dort automatisch. Alternativ: in VS Code „Run and Debug“ mit aktiviertem Auto-Attach — dann reicht ein normaler node-Aufruf im integrierten Terminal.
Brauche ich für moderne Features einen Bundler?
Im Browser: für größere Apps ja — esbuild, Vite oder Rollup bündeln ESM, behandeln Assets und liefern HMR. Im Browser für ein einzelnes Skript reicht <script type="module"> ohne Build. In Node: nein — die Runtime versteht ESM nativ, ein Bundler wird nur für Deployment-Größen-Optimierung gebraucht.
Weiterführende Ressourcen
Externe Quellen
- Introduction – MDN JavaScript Guide
- Modules: ECMAScript modules – Node.js Docs
- Modules: CommonJS modules – Node.js Docs
- Node.js Releases & LTS-Schedule