JavaScript Grundlagen & Dokumentation

Diese Dokumentation bietet eine strukturierte Übersicht über die Grundlagen von JavaScript, Syntax, Variablen, Operatoren, Kontrollstrukturen, Funktionen und Event-Handling basierend auf den Unterlagen von Jennifer Robbins[cite: 17].

JavaScript ist eine clientseitige, lose typisierte und dynamische Skriptsprache, die direkt vom Browser interpretiert wird, um Webseiten Interaktivität und Logik hinzuzufügen[cite: 17].

• Eingebettetes Skript: Direkt im HTML-Dokument innerhalb des <script>-Tags[cite: 17].
• Externes Skript: Über ein externes Dokument per src-Attribut eingebunden[cite: 17].

<!-- Eingebettetes Skript -->
<script>
  // JavaScript-Code
</script>
 
<!-- Externes Skript -->
<script src="script.js"></script>

• Im `<head>`-Bereich: Wenn Skripte ausgeführt werden müssen, bevor der Seiteninhalt geladen ist[cite: 17].
• Vor dem schließenden `</body>`-Tag: Bevorzugt, damit das DOM und die Seitenstruktur vollständig geladen sind, bevor das Skript startet[cite: 17].

• JavaScript unterscheidet strikt zwischen Groß- und Kleinschreibung (Case-sensitive)[cite: 17].
• Einzeilige Kommentare: Beginnen mit //[cite: 17].
• Mehrzeilige Kommentare: Stehen zwischen /* und */[cite: 17].

// Deklaration und Datenzugriff
var fruits = ["Apfel", "Birne", "Kirsche"];
alert(fruits[0]); // Gibt "Apfel" aus

• Vergleich: == (Gleich)[cite: 17], === (Identisch: Wert & Typ gleich)[cite: 17], !=' ' (Nicht gleich)[cite: 17], ''!== (Nicht identisch)[cite: 17], > / < (Größer/Kleiner als)[cite: 17].
• Mathematik: + (Addieren)[cite: 17], - (Subtrahieren)[cite: 17], * (Multiplizieren)[cite: 17], / (Dividieren)[cite: 17], ++ (Inkrement um 1)[cite: 17], – (Dekrement um 1)[cite: 17].

var status = "aktiv";
 
if (status === "aktiv") {
  alert("Zugriff gewährt.");
} else {
  alert("Zugriff verweigert.");
}

Schleifen führen Anweisungen wiederholt aus, solange eine Bedingung wahr ist[cite: 17].

// Zählschleife von 0 bis 2
for (var i = 0; i <= 2; i++) {
  alert("Durchlauf Nummer: " + i);
}

Eine Funktion führt definierte Aufgaben aus, sobald sie aufgerufen wird[cite: 17]. Sie kann Argumente entgegennehmen und Ergebnisse zurückliefern[cite: 17].

// Benutzerdefinierte Funktion mit Parametern
function addieren(a, b) {
  return a + b;
}
 
var summe = addieren(3, 4); // Ergebnis: 7

• Lokaler Scope: Variablen, die innerhalb einer Funktion mit var deklariert werden, sind nur dort gültig[cite: 17].
• Globaler Scope: Außerhalb von Funktionen deklarierte Variablen (oder Variablen innerhalb einer Funktion ohne var) sind im gesamten Skript verfügbar[cite: 17].

Das window-Objekt ermöglicht den Zugriff auf Browserfenster-Eigenschaften und -Methoden[cite: 17]:

• alert(„Text“): Zeigt einen Hinweisdialog an[cite: 17].
• confirm(„Frage“): Öffnet Bestätigungsdialog mit OK/Abbrechen[cite: 17].
• location: Ermöglicht Lese- und Schreibzugriff auf die Adressleiste[cite: 17].
• history: Enthält die aufgerufenen URLs der aktuellen Sitzung[cite: 17].

Events reagieren auf Benutzerinteraktionen wie onclick (Klick)[cite: 17], onmouseover (Maus darüber bewegen)[cite: 17] oder onload (Seite geladen)[cite: 17].

// 1. Zuweisung als Eigenschaft
window.onclick = function() {
  alert("Klick im Fenster erkannt!");
};
 
// 2. Verwendung von addEventListener()
window.addEventListener("click", function() {
  alert("Klick via EventListener!");
});