JavaScript für Anfänger – JavaScript-Tutorial

JavaScript-Grundlagen für interaktive Websites

JavaScript ist die Programmiersprache des Webs. Mit JavaScript können Sie Websites interaktiv machen, auf Benutzeraktionen reagieren und dynamische Inhalte erstellen.

1. Variablen & Datentypen

JavaScript verwendet Variablen zur Speicherung von Daten. let, const und var deklarieren Variablen, während verschiedene Datentypen wie Strings, Numbers, Booleans und Objects verwendet werden.

Beispiel Variablen

// Variablen deklarieren
let name = 'Max';
const age = 30;
var city = 'Berlin';

// Datentypen
let text = 'Hallo';        // String
let number = 42;           // Number
let isActive = true;       // Boolean
let user = {               // Object
  name: 'Max',
  age: 30
};

2. Funktionen

Funktionen sind wiederverwendbare Code-Blöcke, die Aufgaben ausführen. Funktionen können Parameter akzeptieren und Werte zurückgeben.

Beispiel Funktionen

// Funktion deklarieren
function greet(name) {
  return 'Hallo, ' + name + '!';
}

// Arrow Function
const greetArrow = (name) => {
  return 'Hallo, ' + name + '!';
};

// Funktion aufrufen
greet('Max'); // 'Hallo, Max!'

3. DOM-Manipulation

Das Document Object Model (DOM) ermöglicht den Zugriff auf und die Manipulation von HTML-Elementen. JavaScript kann Elemente auswählen, ändern und neue Elemente erstellen.

Beispiel DOM-Manipulation

// Element auswählen
const button = document.querySelector('.btn');

// Event Listener hinzufügen
button.addEventListener('click', () => {
  alert('Button wurde geklickt!');
});

// Element ändern
const heading = document.querySelector('h1');
heading.textContent = 'Neuer Titel';

4. Event-Handling

Event-Handling ermöglicht die Reaktion auf Benutzeraktionen wie Klicks, Tastatureingaben und Scroll-Events. addEventListener ist die moderne Methode für Event-Handling.

5. Arrays & Loops

Arrays speichern Listen von Werten, während Loops wiederholte Aufgaben ausführen. for, while und forEach sind wichtige Loop-Konstrukte in JavaScript.

6. Asynchrone Programmierung

Asynchrone Programmierung mit Promises und async/await ermöglicht nicht-blockierende Operationen. Wichtig für API-Aufrufe und zeitaufwändige Aufgaben.