JavaScript

aus Wikipedia, der freien Enzyklopädie
(Weitergeleitet von Javascript)
Zur Navigation springen Zur Suche springen
JavaScript
// Beispiel JavaScript
function halloWelt() {
	alert('Hello World');
}
window.addEventListener('load', halloWelt);

Beispiel JavaScriptcode

Basisdaten
Paradigmen: multiparadigmatisch
Erscheinungsjahr: 1995
Designer: Brendan Eich
Entwickler: Brendan Eich
Aktuelle Version: ECMAScript 2023[1]  (Juni 2023)
Typisierung: schwach, dynamisch, duck
Wichtige Implementierungen: SpiderMonkey, Rhino, JavaScriptCore, V8
Beeinflusst von: Self, C, Scheme, Perl, Python, Java, Lua
Beeinflusste: ActionScript, Haxe, CoffeeScript, Dart, TypeScript
Lizenz: BSD
www.ecma-international.org/publications-and-standards/standards/ecma-262/

JavaScript (kurz JS) ist eine Skriptsprache, die ursprünglich 1995 von Netscape für dynamisches HTML in Webbrowsern entwickelt wurde, um Benutzerinteraktionen auszuwerten, Inhalte zu verändern, nachzuladen oder zu generieren und so die Möglichkeiten von HTML zu erweitern.[2] Heute wird JavaScript auch außerhalb von Browsern angewendet, etwa auf Servern und in Microcontrollern.[3][4]

Der heutige Name der ursprünglich LiveScript genannten Sprache entstand 1996 aus einer Kooperation von Netscape mit Sun Microsystems. Deren Java-Applets, erstellt mit der gleichfalls 1995 veröffentlichten Programmiersprache Java, wurden mithilfe von LiveScript in den Netscape Navigator integriert. Um die Popularität von Java zu nutzen, wurde LiveScript in JavaScript umbenannt, obwohl die beiden Sprachen voneinander unabhängig entwickelt wurden und völlig unterschiedliche Grundkonzepte aufweisen.

Der als ECMAScript (ECMA 262) standardisierte Sprachkern von JavaScript beschreibt eine dynamisch typisierte, objektorientierte, aber klassenlose Skriptsprache. Sie wird allen objektorientierten Programmierparadigmen unter anderem auf der Basis von Prototypen gerecht, deren Deklaration ab ECMAScript 6 mit einer Syntax ermöglicht wird, wie sie ähnlich auch bei klassenbasierten Programmiersprachen üblich ist. In JavaScript lässt sich je nach Bedarf objektorientiert, prozedural oder funktional programmieren.[5]

Die Syntax von JavaScript ähnelt C-Abkömmlingen. Trotz der Namens- und syntaktischen Ähnlichkeit hat JavaScript nur geringe Gemeinsamkeiten mit Java. So wird in JavaScript Vererbung nicht durch Klassen, sondern durch Prototypen unterstützt.

JavaScript wurde früher hauptsächlich clientseitig eingesetzt. JavaScript bzw. die ECMAScript-Implementierungen ermöglichen aber beispielsweise mit dem Framework Node.js[6] und als JScript bzw. JScript .NET in einer ASP- bzw. ASP.NET-Umgebung auf Microsoft Internet Information Services auch serverseitige Anwendungen. Weitere Beispiele für serverseitige JavaScript-Programmierung sind POW und Jaxer, die auf der Mozilla-JavaScript-Engine SpiderMonkey aufsetzen, V8CGI, welches auf der JavaScript-Implementierung V8 aufbaut und in den Apache HTTP Server integriert wird, sowie QML, eine erweiterte Form von JavaScript zum Zeichnen von Oberflächen und Animationen.

Die Sprache wird auch als Skriptsprache für Spiele und Anwendungsprogramme eingesetzt, da der Sprachkern nur wenige Objekte enthält und dadurch der zur Ausführung von in JavaScript formulierten Skripten erforderliche Interpreter relativ klein gehalten werden kann.

Außerdem wird JavaScript als Verkehrssprache in der Datenbank MongoDB sowie in Microcontrollern eingesetzt.[3][4]

Typische Anwendungsgebiete

[Bearbeiten | Quelltext bearbeiten]

Typische Anwendungsgebiete von JavaScript im Webbrowser sind:

  • dynamische Manipulation von Webseiten über das Document Object Model
  • Plausibilitätsprüfung (Datenvalidierung) von Formulareingaben noch vor der Übertragung zum Server
  • Anzeige von Dialogfenstern
  • Senden und Empfangen von Daten, ohne dass der Browser die Seite neu laden muss (Ajax)
  • Vorschlagen von Suchbegriffen während der Eingabe
  • Werbebanner oder Laufschriften
  • Verschleierung von E-Mail-Adressen zur Bekämpfung von Spam
  • mehrere Frames auf einmal wechseln oder die Seite aus dem Frameset lösen
  • Schreib- und Lesezugriff auf Cookies und den Web Storage innerhalb des Browsers

Einige Anwendungen, die mit JavaScript möglich sind, agieren teilweise gegen den Wunsch des Benutzers oder widersprechen dem Prinzip der geringsten Überraschung. Einige Browser bieten daher Funktionen an, die derartige JavaScript-Funktionen unterdrücken.

Beispiele:

Hinweis im Firefox-Browser bei vielen Dialogfenstern
  • Verschleiern von Internetadressen, auf die ein Link verweist
  • Deaktivieren des Kontextmenüs, um zu erschweren, dass Bilder oder die gesamte Seite abgespeichert werden können
  • Deaktivieren der Kopierfunktion, um zu erschweren, dass Texte oder Bilder kopiert werden können
  • Unaufgeforderte (Werbe-)Pop-ups oder Pop-unders oder aufeinanderfolgende Dialogfenster, die den Benutzer behindern
  • Ungewolltes Schließen des Browserfensters
  • Ungewollte Größenänderung des Browserfensters
  • Barrierearme Webseiten zeichnen sich dadurch aus, dass sie auch bei abgeschaltetem JavaScript möglichst uneingeschränkt nutzbar bleiben. Teilweise schränkt das deaktivierte JavaScript die Benutzbarkeit einer Webseite ein.
  • Maßnahmen, die an den Sicherheitseinstellungen des Browsers vorbei ein Wiedererkennen eines Benutzers bei einem späteren Besuch einer Website erlauben (siehe Anonymität im Internet)
  • Bei anfälligen Webanwendungen kann JavaScript auch von Dritten missbraucht werden, etwa per XSS (Codeeinschleusung).

Am 18. September 1995 veröffentlichte Netscape mit der Vorversion des Navigators 2.0 einen Browser mit einer eingebetteten Skriptsprache, die zu diesem Zeitpunkt LiveScript hieß und von Brendan Eich entwickelt worden war. Die Sprache konnte u. a. Formulareingaben des Benutzers vor dem Absenden überprüfen. Am 4. Dezember 1995 verkündeten Netscape und Sun Microsystems eine Kooperation, die die Interaktion von LiveScript direkt mit Java-Applets zum Ziel hatte. Sun entwickelte die nötigen Java-Klassen, Netscape die Schnittstelle LiveConnect und benannte die Sprache in JavaScript um (JavaScript 1.0).[7][8] JavaScript ist seit der Übernahme von Sun Microsystems eine Marke des Unternehmens Oracle.[9]

Mit der ersten Beta-Version des Navigators 3.0 führte Netscape am 29. April 1996 JavaScript 1.1 ein. In selbiger Version gab es die Neuerungen, auf Bilder zugreifen und sogenannte Rollover-Grafiken erstellen zu können. LiveConnect war jetzt fester Bestandteil des Browsers. Mit der Beta-Version des Internet Explorers 3 stellte Microsoft im Mai 1996 seinen ersten JScript-fähigen Browser vor. Dies war der Beginn des Browserkriegs.[10][11]

Mit der Ankündigung des Netscape Communicators wurde JavaScript 1.2 am 15. Oktober 1996 veröffentlicht; der Netscape Communicator 4.0 mit JavaScript 1.2 erschien jedoch erst am 4. Juni 1997. Ebenfalls im Juni 1997 veröffentlichte die European Computer Manufacturers Association ihren Standard ECMA-262 (ECMAScript), der zusammen mit Netscape entwickelt worden war und die Grundelemente einer Skriptsprache standardisieren sollte. Diese wurde im April 1998 zur ISO-Norm ISO/IEC 16262:1998 Information technology – ECMAScript language specification. Am 1. Oktober 1997 kam der Internet Explorer 4 heraus, der den Sprachumfang von JavaScript 1.1 abdeckte. Darüber hinaus wurden eigene Erweiterungen veröffentlicht, die zu Kompatibilitätsunterschieden zwischen Navigator und Internet Explorer führten und eine DOM-ähnliche Syntax zur Verfügung stellten, die es ermöglichte, auf alle Elemente der Webseite zuzugreifen und diese beliebig verändern zu können.

Der in Java implementierte JavaScript-Interpreter Rhino wurde ab Version 6.0 als Teil der Java-Laufzeitumgebung standardmäßig mitgeliefert.[12] Im Juli 1998 wurde mit der Beta-Version des Netscape Communicators 4.5 JavaScript 1.3, welche schon in der Version 4.06 des Netscape Communicators vorhanden war, veröffentlicht.[13] Im Oktober 1998 stellte Netscape JavaScript 1.4 vor. Diese Version war vollständig kompatibel mit ECMA-262. Ein Browser mit der Unterstützung dieser Version erschien jedoch nicht.[14][15] Im April 2000 kam mit der Preview Release 1 des Navigators 6 JavaScript 1.5 und DOM Level 1. Am 5. Juni 2002 erschien Mozilla 1.0 mit JavaScript 1.5 (JavaScript in der Version 1.5 entspricht ECMA-262 Version 3),[16] am 29. November 2005 Mozilla Firefox 1.5 mit JavaScript 1.6[17], am 12. Juli 2006 Mozilla Firefox 2.0b1 mit JavaScript 1.7[18] und am 18. Dezember 2007 Mozilla Firefox 3.0b2 mit JavaScript 1.8.[19]

Versionsgeschichte von JavaScript

[Bearbeiten | Quelltext bearbeiten]
Versionsgeschichte[20]
Version Veröffentlichung Entsprechung Netscape Navigator Mozilla Firefox Internet Explorer Opera Safari Google Chrome
Ältere Version; nicht mehr unterstützt: 1.0.0 März 1996 2.0 3.0
Ältere Version; nicht mehr unterstützt: 1.1.0 August 1996 3.0
Ältere Version; nicht mehr unterstützt: 1.2.0 Juni 1997 4.0–4.05
Ältere Version; nicht mehr unterstützt: 1.3.0 Oktober 1998 ECMA-262 1st edition / ECMA-262 2nd edition 4.06–4.7x 4.0
Ältere Version; nicht mehr unterstützt: 1.4.0 Netscape Server
Ältere Version; nicht mehr unterstützt: 1.5.0 November 2000 ECMA-262 3rd edition 6.0 1.0
  • 5.5 (JScript 5.5)
  • 6 (JScript 5.6)
  • 7 (JScript 5.7)
  • 8 (JScript 6)
  • 6.0
  • 7.0
  • 8.0
  • 9.0
Ältere Version; nicht mehr unterstützt: 1.6.0 November 2005 1.5 + Array extras + Array & String generics + E4X 1.5
  • 3.0
  • 3.1
Ältere Version; nicht mehr unterstützt: 1.7.0 Oktober 2006 1.6 + Pythonic generators + Iterators + let + destructuring assignments 2.0
  • 3.2
  • 4.0
1.0
Ältere Version; nicht mehr unterstützt: 1.8.0 Juni 2008 1.7 + Generator expressions + Expression closures 3.0
Ältere Version; nicht mehr unterstützt: 1.8.1 Juni 2009 1.8 + geringfügige Updates 3.5
Aktuelle Version: 1.8.2 Januar 2010 1.8.1 + geringfügige Updates 3.6
Aktuelle Version: 1.8.5 Juli 2010 1.8.1 + ECMAScript 5 Compliance 4 9.0 (JScript 9.0)

Versionsgeschichte von ECMAScript (ECMA-262)

[Bearbeiten | Quelltext bearbeiten]

Die aktuelle Version ist die Version 2022, die im Juni 2022 als „ECMAScript 2022“ veröffentlicht wurde.[21] Dieser sollen jährliche Updates folgen.[22] Die Entwicklung der Standards erfolgt auf GitHub.[23]

Version publiziert am Unterschiede zur Vorgängerversion Editor
Ältere Version; nicht mehr unterstützt: 1 Juni 1997 erste Version Guy L. Steele, Jr.
Ältere Version; nicht mehr unterstützt: 2 Juni 1998 Änderungen zwecks Kompatibilität zum internationalen Standard ISO/IEC 16262 Mike Cowlishaw
Ältere Version; nicht mehr unterstützt: 3 Dez. 1999 Neu sind reguläre Ausdrücke, bessere Verarbeitung von Zeichenketten, Kontrollfluss, Fehlerbehandlung mit try/catch, bessere Fehlerbehandlung, bessere Formatierung bei der Ausgabe von Zahlen usw. Mike Cowlishaw
Ältere Version; nicht mehr unterstützt: 4 abgebrochen Wegen Uneinigkeit in Bezug auf die Zukunft der Sprache wurde die weitere Entwicklung des komplexen Entwurfes zu ECMAScript 4 eingestellt. Einige Ideen werden in ES6 wieder aufleben.
Ältere Version; nicht mehr unterstützt: 5 Dez. 2009 Im „strict mode“ wird eine erweiterte Fehlerprüfung eingeschaltet. Unklare Sprachkonstrukte von ECMAScript 3 werden entschärft und neue Features wie getter- und setter-Methoden, Unterstützung von JSON usw. hinzugefügt.[24] Pratap Lakshman, Allen Wirfs-Brock
Ältere Version; noch unterstützt: 5.1 Juni 2011 Entspricht dem internationalen Standard ISO/IEC 16262:2011, Version 3 Pratap Lakshman, Allen Wirfs-Brock
Ältere Version; noch unterstützt: 2015[25][26] Juni 2015 Neue Syntax für komplexe Applikationen wie Klassen und Module, die aber mit ähnlicher Terminologie wie in ECMAScript 5 (strict mode) definiert werden können.[27] Neue Sprachbestandteile wie for/of-Schleifen, teilweise an Python angelehnte Syntax usw. Der Codename lautet “Harmony” und wurde bis kurz vor Verabschiedung als „ECMAScript 6“ bezeichnet.[28], also „ES6“[29]. Allen Wirfs-Brock
Ältere Version; noch unterstützt: 2016[30][31] Juni 2016 ** (Potenzfunktion), Array.prototype.includes, diverse Anpassungen an Generatoren, destruktiven Zuweisungen[32] Brian Terlson
Ältere Version; noch unterstützt: 2017[33] Juni 2017 async/await, diverse Object-Funktionen[32][34][35] Brian Terlson
Ältere Version; noch unterstützt: 2018 Juni 2018[36] global, import(), Rest/Spread Properties, for-await-of (Asynchronous Iterators), String-Padding, …[37] Brian Terlson
Ältere Version; noch unterstützt: 2019 Juni 2019 Array#{flat,flatMap}, Object.fromEntries, String#{trimStart,trimEnd}, Symbol#description, …[38] Brian Terlson, Bradley Farias, Jordan Harband
Ältere Version; noch unterstützt: 2020 Juni 2020 String.matchAll, BigInt, import(), …[39] Jordan Harband, Kevin Smith
Ältere Version; noch unterstützt: 2021 Juni 2021 String.prototype.replaceAll, WeakRefs, Logical Assignment Operators, …[40] Jordan Harband, Shu-yu Guo, Michael Ficarra, Kevin Gibbons
Ältere Version; noch unterstützt: 2022[41] Juni 2022 Private Methoden und Felder in Klassen, Statische Initialisierungs-Blöcke in Klassen, await außerhalb von async-Funktionen, …[42] Shu-yu Guo, Michael Ficarra, Kevin Gibbons
Aktuelle Version: 2023 Juni 2023 Hashbang-Grammar, Symbole für WeakMaps, neue Array-Funktionen

Sandbox-Prinzip

[Bearbeiten | Quelltext bearbeiten]

JavaScript wird im Browser in einer sogenannten Sandbox ausgeführt. Dies soll bewirken, dass man in JavaScript nur Zugriff auf die Objekte des Browsers hat und nicht auf das Dateisystem zugreifen kann. Eine Ausnahme stellt der Lesezugriff auf eine Datei dar, die per Dateiauswahl-Dialog, gestartet mit dem HTML-Element <input type="file">, vom Benutzer ausgewählt wurde.

Um Sicherheitsprobleme wie das sogenannte Cross-Site-Scripting zu verhindern, wird jede Website oder Webanwendung innerhalb des Browsers isoliert ausgeführt und ein Datenaustausch unterbunden. Ohne diesen Schutz wäre es möglich, über eine Seite Schadcode auszuführen, der beispielsweise Bank- oder Logindaten in anderen parallel geöffneten Browserfenstern ausliest oder manipuliert.

Auch bestimmte sicherheitsrelevante Browserfunktionen wie das Schließen des Browserfensters, das Aus- und Einblenden von Symbolleisten, das Ändern der Browserstartseite, der Zugriff auf die Zwischenablage oder das Auslesen der zuletzt besuchten Webseiten des Anwenders werden durch obligatorische Nutzereingaben geschützt.

Standardmäßig wird ein Skript innerhalb eines Browsers in Form eines einzigen Threads ausgeführt. Warteschleifen oder lange Berechnungen sind daher in JavaScript-Programmen zu vermeiden. Mit Worker-Objekten ist es möglich, weitere Threads zu erzeugen.[43]

Deaktivieren von JavaScript

[Bearbeiten | Quelltext bearbeiten]

In vielen JavaScript-fähigen Browsern lässt sich JavaScript abschalten oder lassen sich einzelne Aktionen wie die Änderung des Textes in der Statusleiste oder die Manipulation von Browserfenstern deaktivieren. Dies kann bei einigen Browsern mittels Erweiterungen, die JavaScript anhand von White- und Blacklists gezielt auf Seiten ein- und ausschalten, auch automatisiert werden. Daher können sich Entwickler nicht darauf verlassen, dass JavaScript-Programme sich in jeder Umgebung gleich verhalten bzw. überhaupt funktionieren.

JavaScript ist dynamisch typisiert. Das bedeutet, dass die Zuweisung von Werten an Variablen keinen typbasierten Einschränkungen unterliegt. Allerdings gibt es diverse Erweiterungen von JavaScript, die eine statische Typisierung optional beziehungsweise zwingend erfordern, zum Beispiel TypeScript von Microsoft.[44]

Aufgrund der dynamischen Typisierung ist der Datentyp keine Eigenschaft einer Variablen, sondern Laufzeit-bezogen die Eigenschaft ihres aktuellen Wertes (oder auch die Eigenschaft eines Literals). Der Datentyp eines Wertes lässt sich mit dem unären Operator typeof ermitteln.

Primitive Datentypen

[Bearbeiten | Quelltext bearbeiten]

Zu den primitiven Datentypen in JavaScript gehören Zahlen, Zeichenketten, boolesche Werte, Symbole, null und undefined.

  • Numerische Werte können entweder den Typ Number (angezeigt durch typeof als "number") oder BigInt haben (angezeigt durch typeof als "bigint"). Während der Datentyp Number für Gleitkommazahlen verwendet wird, ermöglicht der Datentyp BigInt die Darstellung ganzer Zahlen beliebiger Größe, die den Bereich überschreiten, den Number abdecken kann.
  • Zeichenketten haben den Typ String (angezeigt durch typeof als "string").
  • Boolesche Werte haben den Typ Boolean (angezeigt durch typeof als "boolean")
  • Symbole haben den Typ Symbol (angezeigt durch typeof als "symbol") und fungieren als eindeutige Identifikatoren, werden jedoch seltener verwendet.
  • Der Typ Null hat nur den Wert null (typeof liefert "object", was historisch bedingt ist).
  • Der Typ Undefined hat nur den Wert undefined (typeof liefert "undefined").

Nicht primitive Datentypen

[Bearbeiten | Quelltext bearbeiten]

Funktionen sind kein primitiver Typ (typeof liefert "function"). Für alle anderen Werte – reguläre Ausdrücke, Arrays und den Wert null inbegriffen – liefert typeof den Zeichenketten-Wert "object" zurück. Es ist zu beachten, dass null ein primitiver Datentyp ist, auch wenn typeof für null aus historischen Gründen den Wert "object" liefert. Im Gegensatz zu anderen Programmiersprachen gibt es in JavaScript keine echten assoziativen Arrays.[45]

Objekte, die durch die vordefinierten Konstruktorfunktionen String(), Number() und Boolean() erzeugt werden, verhalten sich ähnlich wie Werte der entsprechenden primitiven Datentypen. Allerdings gibt der typeof-Operator für solche Objekte den Wert "object" zurück. Diese Art von Objekten wird als Wrapper-Objekte bezeichnet. Für den Datentyp Symbol existiert keine gleichnamige Konstruktorfunktion. Im Folgenden finden wir ein Beispiel einer Variablen und dem entsprechenden Wrapper-Objekt:

let simpleString = "Beispieltext";
// Die Funktion "alert" gibt das Ergebnis "string" in einem Fenster aus.
alert(typeof simpleString);

let stringObject = new String("Beispieltext");
alert(typeof stringObject); // ergibt "object"

Umgekehrt werden Werte der primitiven Typen Number, Boolean und String bei Bedarf automatisch in Objekte der entsprechenden Konstruktorfunktion umgewandelt:

let simpleString = "Beispieltext";
alert(simpleString.length); // ergibt 12

In diesem Beispiel wird die Eigenschaft length aufgerufen, obwohl simpleString ein primitiver String ist. JavaScript wandelt automatisch den primitiven String in ein temporäres String-Objekt um, um die Eigenschaft length abzurufen."

Kontrollstrukturen

[Bearbeiten | Quelltext bearbeiten]

JavaScript kennt die üblichen Kontrollstrukturen. Sollen diese mehr als eine Anweisung enthalten, so muss ein in geschweifte Klammern eingeschlossener Block eingesetzt werden. Anweisungen werden mit einem Semikolon abgeschlossen. Dies ist aber in den meisten Fällen optional; durch die automatic semicolon insertion wird es meist automatisch ergänzt.

if-else (Bedingte Anweisung)

[Bearbeiten | Quelltext bearbeiten]
if (bedingung) {
    anweisungen;
} else {
    anweisungen;
}

Kurzschreibweise für bedingte Wertzuweisungen:

variable = bedingung ? wertWennWahr : wertWennFalsch;

switch-Kontrollstruktur

[Bearbeiten | Quelltext bearbeiten]
switch (variable) {
    case wert1:
        anweisungen;
        break;
    case wert2:
        anweisungen;
        break;
    default:
        anweisungen;
}

while-Schleife

while (bedingung) {
    anweisungen;
}

do-while-Schleife

do {
    anweisungen;
} while (bedingung);

for-Schleife

for (startausdruck; bedingung; iterationsausdruck) {
    anweisungen;
}

for … in-Schleife

Mit dieser Anweisung werden alle eigenen und ererbten Eigenschaften eines Objektes durchlaufen, die das interne Attribut Enumerable aufweisen.[46] Dieses Attribut wurde in ECMA Script 5 eingeführt und ist für bestimmte eingebaute Eigenschaften (wie z. B. die Funktion toString des Prototyps Object) nicht gesetzt, es kann allerdings im Regelfall vom Benutzer gesetzt (und entfernt) werden.[47] Bei jedem Schleifendurchgang wird einer angegebenen Variable der Eigenschaftsname zugewiesen.

for (let eigenschaftsname in objekt) {
    anweisungen;
}

for … of-Schleife

Diese Kontrollstruktur funktioniert wie eine for … in-Schleife, mit dem Unterschied, dass hier der angegebenen Variable nicht der Eigenschaftsname, sondern der Eigenschaftswert zugewiesen wird.[48]

for (let wert of objekt) {
    anweisungen;
}

Variablen sollten in JavaScript mit let oder var deklariert werden und sind dann innerhalb des Scopes gültig, in dem sie deklariert wurden, wobei let den Scope weiter eingrenzt als var.[49] Verwendet man Variablen ohne sie vorher explizit zu deklarieren, werden diese implizit als Eigenschaften des globalen Objekts (im Browser window) deklariert; dieses Verhalten kann man durch die Anweisung "use strict"; unterbinden. Eine Besonderheit von JavaScript ist das Hoisting von Variablen, das dafür sorgt, dass sämtliche in einem Codeabschnitt deklarierten Variablen und Funktionen bei der Abarbeitung automatisch direkt an den Anfang vorgezogen werden (nur die Deklaration, nicht aber deren Wertzuweisung).

Geltungsbereich von Variablen

[Bearbeiten | Quelltext bearbeiten]

In JavaScript gibt es globale und lokale Variablen abhängig davon, wo sie deklariert werden und wie sie verwendet werden.

  • Globale Variablen:

Variablen, die außerhalb von Funktionen deklariert werden, sind global gültig. Im Browser bedeutet global, dass solche Variablen auf der gesamten Webseite und in allen aktiven JavaScript-Dateien zugänglich sind. Dies kann zu unerwünschten Nebeneffekten führen, insbesondere wenn andere Skripte wie Drittanbieter-Plugins, Web Analytics oder Werbebannern eingebunden sind. Daher sollten globale Variablen nach Möglichkeit vermieden werden.

let explicit; // Explizite Deklaration einer globalen Variable
explicit = "explizit deklariert"; // Definition einer globalen Variable
console.log(explicit); // Ausgabe: explizit deklariert

Implizit deklarierte Variablen sind immer global. Auch wenn eine Variable innerhalb einer Funktion implizit ohne let oder var deklariert wurde, wird sie automatisch zu einer globalen Variable.

function foo() {
    implicit = "implizit deklariert"; // Definition einer globalen Variable
}

foo();
console.log(implicit); // Ausgabe: implizit deklariert

Eine implizit deklarierte Variable wird automatisch zu einer Eigenschaft des globalThis-Objekts. Das trifft bei explizit deklarierten globalen Variablen nicht zu.

console.log(globalThis.implicit); // Ausgabe: implizit deklariert
console.log(typeof globalThis.explicit); // Ausgabe: undefined
  • Lokaler Geltungsbereich:

Variablen, die innerhalb von Funktionen deklariert oder als Funktionsparameter verwendet werden, haben einen lokalen Geltungsbereich. Das bedeutet, dass sie nur innerhalb der Funktion sichtbar und zugänglich sind.

function bar(parameter) { // Deklaration eines Funktionsparameters
    let variable = "lokale Variable" // Deklaration einer lokalen Variablen

    console.log(parameter);
    console.log(variable); // Ausgabe: lokale Variable
}

bar("lokaler Parameter");
console.log(typeof parameter); // Ausgabe: undefined
console.log(typeof variable); // Ausgabe: undefined

Konstanten sollen mit const deklariert werden, bei der Initialisierung muss ihnen ein Wert zugewiesen werden. Für den Gültigkeitsbereich gelten dieselben Bedingungen wie bei Variablendeklarationen mit let. Konstanten können nicht durch erneute Zuweisung verändert werden, allerdings können – wenn es sich bei der Konstanten um Objekte handelt – einzelne Eigenschaften der Konstanten geändert werden.