Wie kann ich JavaScript in Visual Studio Code ausführen?

1. Installation von Visual Studio Code und Node.js
2. JavaScript-Datei in Visual Studio Code erstellen
3. JavaScript-Code im Terminal ausführen
4. Alternative: Erweiterungen zum Ausführen von JavaScript
5. JavaScript im Browser ausführen
6. Zusammenfassung

Visual Studio Code (VS Code) ist ein sehr beliebter und vielseitiger Quellcode-Editor, der unter anderem hervorragend für die Webentwicklung geeignet ist. Wenn du JavaScript-Code schreiben und ausführen möchtest, bietet dir VS Code verschiedene Möglichkeiten, dies bequem in der Entwicklungsumgebung umzusetzen. Im Folgenden erkläre ich ausführlich, wie du JavaScript in Visual Studio Code ausführen kannst.

Installation von Visual Studio Code und Node.js

Bevor du JavaScript in Visual Studio Code ausführen kannst, musst du sicherstellen, dass du VS Code installiert hast. Außerdem benötigst du eine Laufzeitumgebung für JavaScript außerhalb des Browsers, in der Regel Node.js. Node.js ist eine Open-Source-JavaScript-Laufzeit, die serverseitige JavaScript-Ausführung ermöglicht.

Du kannst Node.js von der offiziellen Webseite (https://nodejs.org) herunterladen und installieren. Nach der Installation kannst du überprüfen, ob Node.js korrekt eingerichtet ist, indem du im Terminal oder in der Eingabeaufforderung node -v eingibst. Dies sollte die installierte Node.js-Version anzeigen.

JavaScript-Datei in Visual Studio Code erstellen

Öffne Visual Studio Code und erstelle eine neue Datei mit der Endung .js, beispielsweise app.js. In dieser Datei kannst du nun deinen JavaScript-Code schreiben. Zum Beispiel kannst du folgende einfache Zeile eingeben:

Speichere die Datei ab, damit VS Code und Node.js darauf zugreifen können.

JavaScript-Code im Terminal ausführen

Visual Studio Code verfügt über ein integriertes Terminal, das du nutzen kannst, um JavaScript-Dateien mit Node.js auszuführen. Öffne dazu das Terminal in VS Code über das Menü Terminal → Neues Terminal. Das Terminal öffnet sich standardmäßig im Verzeichnis deines Projekts.

Gib nun folgenden Befehl ein, um deine JavaScript-Datei auszuführen:

Die Ausgabe deiner JavaScript-Datei sollte im Terminal erscheinen. Im Beispiel wäre das "Hallo Welt!". Dies ist der einfachste Weg, JavaScript-Code in Visual Studio Code auszuführen.

Alternative: Erweiterungen zum Ausführen von JavaScript

Wenn du den Prozess vereinfachen möchtest, kannst du auch VS Code Erweiterungen installieren, die das Ausführen von JavaScript-Dateien direkt per Knopfdruck ermöglichen. Eine beliebte Erweiterung ist Code Runner. Mit Code Runner kannst du JavaScript, aber auch viele andere Sprachen direkt in VS Code ausführen, ohne das Terminal manuell zu bedienen.

Nach der Installation von Code Runner kannst du deinen Code einfach mit dem Klick auf den Play-Button oben rechts oder über das Kontextmenü mit Run Code ausführen. Die Ausgabe erscheint dann im Ausgabefenster von VS Code.

JavaScript im Browser ausführen

Alternativ kannst du JavaScript auch in HTML-Dateien einbetten und diese im Browser ausführen. Hierfür erstellst du eine HTML-Datei, in der du deinen JavaScript-Code innerhalb eines <script>-Tags einfügst. In VS Code kannst du dann die HTML-Datei öffnen und mit einer Live-Server-Erweiterung wie Live Server die Datei im Browser öffnen. Somit kannst du JavaScript zusammen mit HTML und CSS direkt im Browser testen.

Zusammenfassung

Um JavaScript-Code in Visual Studio Code auszuführen, benötigst du eine JavaScript-Laufzeit wie Node.js. Mit dem integrierten Terminal kannst du deine JS-Dateien manuell mit dem Befehl node datei.js starten. Erweiterungen wie Code Runner erleichtern das Ausführen mit wenigen Klicks. Für Client-seitiges JavaScript bietet sich die Kombination aus HTML, dem <script>-Tag und einem Live Server an, um den Code im Browser darzustellen und zu testen.