JavaScript – Interaktivität und Logik im Web
JavaScript ist die Programmiersprache des Webs — sie macht statische HTML/CSS-Seiten interaktiv. Moderne JavaScript-Entwicklung nutzt ES6+-Features, asynchrone Programmierung und ein Modul-System das saubere, wartbare Codebasen ermöglicht.
Moderne JavaScript-Features
ES6+ Grundlagen
let/const statt var. Arrow Functions: (x) => x * 2. Template Literals: Hallo ${name}. Destructuring: const { title, href } = link. Spread/Rest: [...array], ...args. Optional Chaining: user?.address?.city. Diese Features sind heute Standard.
DOM-Manipulation
querySelector/querySelectorAll für Elementselektion. addEventListener für Events. classList.add/remove/toggle für Klassen. dataset für data-Attribute. innerHTML nur für sicheren, kontrollierten Content — niemals für User-Input (XSS-Risiko).
async/await und Fetch
Asynchrone Operationen lesbar schreiben: const data = await fetch('/api/data').then(r => r.json()). Try/catch für Fehlerbehandlung. Promises als Basis — async/await ist syntaktischer Sugar. Wichtig: Loading- und Error-States immer behandeln.
ES Module
import/export für Modul-System. Named exports: export function foo() {}. Default exports: export default class. Import: import { foo } from './module.js'. Kein globaler Namespace, explizite Abhängigkeiten, Tree-Shaking möglich.
JavaScript auf diesem Projekt
digitalherrmann.de nutzt JavaScript sparsam und gezielt: Client-seitige Skripte in src/scripts/ als TypeScript-Module, React Islands (client:*) nur wo echte Interaktivität nötig ist, DOM-Hooks über data-*-Attribute statt CSS-Selektoren.
Häufig gestellte Fragen
TypeScript oder JavaScript — was soll ich lernen?
TypeScript ist typisiertes JavaScript — alle JavaScript-Kenntnisse sind direkt übertragbar. TypeScript fängt Fehler zur Entwicklungszeit ab und verbessert IDE-Unterstützung erheblich. Für neue Projekte: direkt TypeScript. Für bestehende JS-Projekte: schrittweise Migration möglich.
Brauche ich ein Framework oder reicht Vanilla JS?
Vanilla JS reicht für: einfache Interaktionen, einzelne Komponenten, performance-kritische Szenarien. Frameworks (React, Vue, Svelte) lohnen sich für: komplexe, zustandsbehaftete UIs, Teams, große Single-Page-Applications. Auf Astro-Projekten: Vanilla JS für einfaches, React Islands für komplexes.