Qt-Script/JavaScript Übersicht¶

Einleitung¶

Qt-Script entspricht weitgehendst JavaScript, welches eine weit verbreitete und mächtige Programmiersprache ist. Sie wird für die Webentwicklung und browserbasierte Anwendungen eingesetzt, eignet sich daher hervorragend for Automationen innerhalb einer Anwendung.

In dieser Kurzen Übersicht sprechen wir immer von JavaScript, da die Unterschiede zwischen den einzelnen Sprachen für die Anwendung in unseren Anwendungen nicht relevant ist.

JavaScript ist eine interpretierte Sprache und basiert auf dem ECMAScript-Standard. Obwohl der Name JavaScript Ähnlichkeiten mit der Programmiersprache Java aufweist, sind die beiden Sprachen grundlegend verschieden. JavaScript ist eine prototypbasierte Skriptsprache, während Java eine objektorientierte Programmiersprache ist.

Im Folgenden findest du eine kurze Übersicht über einige grundlegende Konzepte und Merkmale von JavaScript. Genauere Details zu den hier beschriebenen Spracheigenschaften findest du in der umfangreichen Dokumentation des Mozilla Projekts.

Siehe dazu: MDN Web Docs – JavaScript.

Grundlagen¶

Groß-/Kleinschreibung¶

JavaScript ist eine case-sensitive Sprache, das bedeutet, dass Groß- und Kleinschreibung bei Variablen, Funktionen und Bezeichnern unterschieden wird. Zum Beispiel sind myVariable und MyVariable zwei unterschiedliche Variablen.

Whitespace¶

JavaScript ignoriert Whitespace (Leerzeichen, Tabulatoren und Zeilenumbrüche) zwischen Anweisungen und Bezeichnern. Du kannst sie verwenden, um den Code übersichtlicher und leichter lesbar zu gestalten.

Semikolons¶

Semikolons werden in JavaScript verwendet, um das Ende einer Anweisung zu signalisieren. Obwohl sie optional sind und JavaScript in der Lage ist, sie automatisch einzufügen, ist es empfehlenswert, sie explizit zu setzen, um Verwirrung und mögliche Fehler zu vermeiden.

Das folgende Beispiel zeigt die Probleme welche durch das weglassen von Semikolons entstehen können:

return
x + 10;

// Der Code oben wird einen undefinierten Wert zurückgeben,
// da er folgendermassen interpretiert wird:
// return; <--
// x + 10;

x = 10 + 5
(y + 6)
// Der Code oben wird interpretiert als:
// x = 10 + 5(y + 6);

Kommentare¶

In JavaScript gibt es zwei Arten von Kommentaren:

Einzeilige Kommentare: Sie beginnen mit // und erstrecken sich bis zum Ende der Zeile. Beispiel:
```
// Das ist ein einzeiliger Kommentar
```
Mehrzeilige Kommentare: Sie beginnen mit /* und enden mit */. Sie können sich über mehrere Zeilen erstrecken. Beispiel:
```
/* Das ist ein
   mehrzeiliger
   Kommentar */
```

Es ist wichtig, Kommentare zu verwenden, um den Code zu dokumentieren, die Lesbarkeit zu verbessern und anderen Entwicklern das Verständnis des Codes zu erleichtern.

Variablen¶

Einführung¶

Variablen sind grundlegende Bausteine in JavaScript, die dazu dienen, Werte zu speichern und auf sie zuzugreifen. Du kannst Variablen verwenden, um Daten zu speichern, die im Verlauf deines Programms verändert oder manipuliert werden müssen.

Variablendeklaration¶

In JavaScript kannst du Variablen mit den Schlüsselwörtern var, let oder const deklarieren:

var: Das var-Schlüsselwort wurde in früheren Versionen von JavaScript verwendet, um Variablen zu deklarieren. Diese Variablen haben eine funktionsweite Gültigkeit und werden beim Hoisting (Hochziehen) an den Anfang der Funktion gesetzt. Seit ES6 (ECMAScript 2015) ist es üblicher, let und const zu verwenden.
let: Das let-Schlüsselwort wird verwendet, um Variablen mit blockweiter Gültigkeit zu deklarieren. Variablen, die mit let deklariert werden, sind nur innerhalb des Blocks, der sie umgibt, sichtbar.
const: Das const-Schlüsselwort wird verwendet, um Konstanten zu deklarieren. Eine Konstante ist eine Variable, deren Wert nach der initialen Zuweisung nicht mehr geändert werden kann. Konstanten haben ebenfalls blockweite Gültigkeit.

var name = "John";
let age = 30;
const pi = 3.14159;

Benennung von Variablen¶

Bei der Benennung von Variablen in JavaScript gibt es einige Regeln, die du beachten solltest:

Variablennamen dürfen Buchstaben, Zahlen, Unterstriche (_) und Dollarzeichen ($) enthalten.
Variablennamen müssen mit einem Buchstaben, einem Unterstrich oder einem Dollarzeichen beginnen. Sie dürfen nicht mit einer Zahl beginnen.
Variablennamen sind case-sensitive. Das bedeutet, dass myVariable und MyVariable zwei unterschiedliche Variablen sind.
Es ist nicht erlaubt, reservierte Schlüsselwörter als Variablennamen zu verwenden (z. B. let, const, function, if usw.).

Einige Beispiele für gültige Variablennamen:

let myVariable;
let _myVariable;
let $myVariable;
let myVariable1;

Einige Beispiele für ungültige Variablennamen:

// let 1myVariable; // Ungültig, beginnt mit einer Zahl
// let let; // Ungültig, reserviertes Schlüsselwort

Variablenzuweisung¶

Du kannst einer Variablen einen Wert zuweisen, indem du den Variablennamen, gefolgt von einem Gleichheitszeichen (=) und dem Wert verwendest. Der Wert kann eine Zahl, ein Text (String), ein Objekt, eine Funktion oder ein anderer Datentyp sein.

let x = 10;
let y = "Hello, World!";
let z = { firstName: "John", lastName: "Doe" };

Du kannst den Wert einer Variablen ändern, indem du ihr einen neuen Wert zuweist (außer bei Konstanten, die mit const deklariert wurden):

let x = 10;
x = 20; // x hat jetzt den Wert 20

Variablentypen¶

JavaScript ist eine dynamisch typisierte Sprache. Das bedeutet, dass Variablen keinen festen Typ haben und der Typ einer Variable während der Laufzeit des Programms geändert werden kann.

let x = 10; // x ist eine Zahl
x = "Hello, World!"; // x ist jetzt ein String

Datentypen¶

JavaScript ist eine dynamisch typisierte Sprache, das bedeutet, dass der Typ einer Variablen zur Laufzeit bestimmt wird und sich ändern kann. Es gibt einige grundlegende Datentypen, die du in JavaScript verwenden kannst:

Number¶

Der Number-Datentyp repräsentiert sowohl Ganzzahlen als auch Fließkommazahlen. Beispiel:

let integer = 42;
let float = 3.14;

String¶

Der String-Datentyp repräsentiert eine Zeichenkette (Text). Du kannst String-Literale mit einfachen Anführungszeichen (‚‘), doppelten Anführungszeichen („“) oder Backticks (``) erstellen. Beispiel:

let singleQuotes = 'Hallo, Welt!';
let doubleQuotes = "Hallo, Welt!";
let backticks = `Hallo, Welt!`;

Boolean¶

Der Boolean-Datentyp repräsentiert einen Wahrheitswert, der entweder true oder false sein kann. Beispiel:

let isTrue = true;
let isFalse = false;

Null¶

Der Null-Datentyp hat genau einen Wert: null. Eine Variable, der null zugewiesen ist, hat keinen Wert und keine Referenz. Beispiel:

let empty = null;

Undefined¶

Der Undefined-Datentyp hat genau einen Wert: undefined. Eine Variable, die nicht initialisiert wurde, hat den Wert undefined. Beispiel:

let notInitialized;
console.log(notInitialized); // undefined

Object¶

Der Object-Datentyp repräsentiert eine Sammlung von Eigenschaften und Methoden. Objekte sind in JavaScript sehr wichtig und werden in einem späteren Kapitel ausführlicher behandelt. Beispiel:

let person = {
    firstName: 'John',
    lastName: 'Doe',
    age: 30
};

Function¶

Das Function-Objekt repräsentiert Funktionen in JavaScript. Funktionen sind wiederverwendbare Codeblöcke, die einen bestimmten Aufgabenbereich ausführen. Beispiel:

function greet(name) {
    return 'Hallo, ' + name + '!';
}
console.log(greet('EducateIT')); // "Hallo, EducateIT!"

Symbol¶

Der Symbol-Datentyp wurde in ECMAScript 2015 eingeführt und wird verwendet, um eindeutige und nicht änderbare Werte zu erzeugen. Beispiel:

let mySymbol = Symbol('mySymbol');

Ermitteln des Typs¶

JavaScript bietet auch Funktionen, um den Typ einer Variablen zu ermitteln, wie die typeof-Operator. Beispiel:

console.log(typeof 42); // "number"
console.log(typeof 'Hallo, Welt!'); // "string"
console.log(typeof true); // "boolean"
console.log(typeof null); // "object" (dies ist historisch bedingt und gilt als Fehler in der Sprache)
console.log(typeof undefined); // "undefined"
console.log(typeof {firstName: 'John', lastName: 'Doe'}); // "object"
console.log(typeof Symbol('mySymbol')); // "symbol"

Eingebaute Objekte¶

JavaScript bietet eine Reihe von eingebauten Objekten, die verschiedene nützliche Funktionen und Eigenschaften bereitstellen. In diesem Kapitel erhältst du eine Übersicht über einige wichtige eingebaute Objekte und ihre Verwendung.

Array¶

Das Array-Objekt ist ein globaler Objekttyp, der Listen ähnlicher Elemente speichert. Arrays können unterschiedliche Datentypen enthalten und sind dynamisch in der Größe. Beispiel:

let numbers = [1, 2, 3, 4, 5];
console.log(numbers[0]); // 1
console.log(numbers.length); // 5

var x = []; // Neues leeres Array
x.push("apple"); // Element zum Array hinzufügen
var y = x[0]; // Auf das erste Element zugreifen

// Array mit undefinierten Elementen
var z = [2, 3, , , , , 3, 2];

// Array-Objekt mit 6 Elementen
var a = new Array(2, 3, 4);

// Array mit 100 Elementen
var b = new Array(100);

Date¶

Das Date-Objekt ermöglicht die Arbeit mit Datum und Uhrzeit. Es stellt Funktionen zur Verfügung, um Datums- und Zeitwerte zu erstellen, zu manipulieren und zu formatieren. Beispiel:

// Gibt das aktuelle Datum und die aktuelle Uhrzeit aus
let currentDate = new Date();
console.log(currentDate);

// Neues datum 2011-12-10 00:00:00
var b = new Date(2011,12,10);

// Neues datum 2011-09-01 14:32:12
var c = new Date(2011,9,1,14,32,12);

// Umwandeln von text
var d = new Date("2011-9-1 12:14:09");

// Zugriff auf die einzelnen Elemente
d.getFullYear(); // = 2011
d.getMonth(); // = 8 (start von 0)
d.getDate(); // = 1
d.getHours(); // = 12
d.getMinutes(); // = 14
d.getSeconds(); // = 9

Error¶

Das Error-Objekt repräsentiert Laufzeitfehler, die während der Programmausführung auftreten können. Es kann verwendet werden, um benutzerdefinierte Fehler zu erstellen und zu werfen. Beispiel:

try {
    throw new Error('Ein Fehler ist aufgetreten!');
} catch (error) {
    console.log(error.message); // "Ein Fehler ist aufgetreten!"
}

Math¶

Das Math-Objekt ist ein globaler Objekttyp, der mathematische Konstanten und Funktionen bereitstellt. Beispiel:

console.log(Math.PI); // 3.141592653589793
console.log(Math.sqrt(9)); // 3

Mehr dazu findest du im Kapitel Math-Objekt.

Reguläre Ausdrücke¶

Regular Expression-Objekte, auch bekannt als RegExp, ermöglichen die Arbeit mit Mustern in Text. Sie werden verwendet, um Textinhalte zu suchen, zu ersetzen und zu extrahieren. Beispiel:

let regex = /world/;
console.log(regex.test('Hello, world!')); // true

Weitere eingebaute Objekte¶

JavaScript bietet auch viele weitere eingebaute Objekte, wie zum Beispiel:

JSON: Zum Arbeiten mit JSON-Datenformat
Map: Zum Speichern von Schlüssel-Wert-Paaren
Set: Zum Speichern von eindeutigen Werten

In den folgenden Kapiteln werden einige dieser Objekte und ihre Verwendung ausführlicher besprochen.

Operatoren¶

In JavaScript gibt es verschiedene Arten von Operatoren, die verwendet werden, um Berechnungen, Vergleiche oder logische Operationen durchzuführen. In diesem Kapitel werden die wichtigsten Operatoren vorgestellt.

Arithmetische Operatoren¶

Arithmetische Operatoren führen mathematische Berechnungen mit numerischen Werten durch. Die grundlegenden arithmetischen Operatoren sind:

Addition: +
Subtraktion: -
Multiplikation: *
Division: /
Modulo (Rest der Division): %

Beispiele:

var a = 10 + 5; // 15
var b = 10 - 5; // 5
var c = 10 * 5; // 50
var d = 10 / 5; // 2
var e = 10 % 3; // 1

Vergleichsoperatoren¶

Vergleichsoperatoren werden verwendet, um zwei Werte zu vergleichen und ein Boolesches Ergebnis (true oder false) zurückzugeben. Die häufigsten Vergleichsoperatoren sind:

Gleich: ==
Ungleich: !=
Identisch (gleich und vom gleichen Typ): ===
Nicht identisch (ungleich oder unterschiedliche Typen): !==
Größer als: >
Kleiner als: <
Größer oder gleich: >=
Kleiner oder gleich: <=

Beispiele:

var a = 5 == 5; // true
var b = 5 != 5; // false
var c = 5 === "5"; // false
var d = 5 !== "5"; // true
var e = 5 > 3; // true
var f = 5 < 3; // false
var g = 5 >= 5; // true
var h = 5 <= 5; // true

Logische Operatoren¶

Logische Operatoren werden verwendet, um logische Operationen durchzuführen und ein Boolesches Ergebnis zurückzugeben. Die grundlegenden logischen Operatoren sind:

Logisches UND: &&
Logisches ODER: ||
Logisches NICHT: !

Beispiele:

var a = true && true; // true
var b = true && false; // false
var c = false || true; // true
var d = false || false; // false
var e = !true; // false
var f = !false; // true

Übersicht der Operatoren¶

Operator	Beschreibung
`=`	Zuweisung
`+=`	Addieren und Zuweisen
`-=`	Subtrahieren und Zuweisen
`*=`	Multiplizieren und Zuweisen
`/=`	Dividieren und Zuweisen
`%=`	Modulo und Zuweisen
`==`	Gleich
`!=`	Ungleich
`>`	Größer als
`>=`	Größer oder gleich
`<`	Kleiner als
`<=`	Kleiner oder gleich
`===`	Identisch, gleich und vom gleichen Typ
`!==`	Nicht identisch
`\|\|`	Logisches ODER
`&&`	Logisches UND
`a ? b : c`	Ternärer bedingter Operator
`&`	Bitweises UND
`\|`	Bitweises ODER
`^`	Bitweises XOR
`<<`	Linksverschiebung mit Nullfüllung
`>>`	Rechtsverschiebung, Kopien des Vorzeichenbits werden von links eingeschoben
`>>>`	Rechtsverschiebung mit Nullfüllung
`~`	Negation, alle Bits invertieren
`++`	Inkrement
`--`	Dekrement
`**`	Exponent
`**=`	Exponent und Zuweisung

Math-Objekt¶

Das Math-Objekt in JavaScript stellt eine Sammlung von mathematischen Funktionen und Konstanten bereit, um mathematische Berechnungen durchzuführen. Es hat kein Konstruktor und alle Eigenschaften und Methoden können direkt auf dem Math-Objekt aufgerufen werden.

Eigenschaften¶

Eigenschaft	Beschreibung
`Math.E`	Die Basis des natürlichen Logarithmus, etwa 2.718
`Math.LN2`	Der natürliche Logarithmus von 2, etwa 0.693
`Math.LN10`	Der natürliche Logarithmus von 10, etwa 2.303
`Math.LOG2E`	Der Logarithmus von E zur Basis 2, etwa 1.443
`Math.LOG10E`	Der Logarithmus von E zur Basis 10, etwa 0.434
`Math.PI`	Die Kreiszahl Pi, etwa 3.14159
`Math.SQRT1_2`	Die Quadratwurzel von 1/2, etwa 0.707
`Math.SQRT2`	Die Quadratwurzel von 2, etwa 1.414

Methoden¶

Methode	Beschreibung
`Math.abs()`	Gibt den Absolutwert einer Zahl zurück
`Math.acos()`	Gibt den Arkuskosinus einer Zahl zurück
`Math.acosh()`	Gibt den hyperbolischen Arkuskosinus einer Zahl zurück
`Math.asin()`	Gibt den Arkussinus einer Zahl zurück
`Math.asinh()`	Gibt den hyperbolischen Arkussinus einer Zahl zurück
`Math.atan()`	Gibt den Arkustangens einer Zahl zurück
`Math.atanh()`	Gibt den hyperbolischen Arkustangens einer Zahl zurück
`Math.atan2()`	Gibt den Arkustangens des Quotienten seiner Argumente zurück
`Math.cbrt()`	Gibt die Kubikwurzel einer Zahl zurück
`Math.ceil()`	Rundet eine Zahl auf die nächsthöhere ganze Zahl auf
`Math.clz32()`	Gibt die Anzahl der führenden Nullen von 32-Bit ganzzahligen Argument zurück
`Math.cos()`	Gibt den Kosinus einer Zahl zurück
`Math.cosh()`	Gibt den hyperbolischen Kosinus einer Zahl zurück
`Math.exp()`	Gibt e hoch der angegebenen Potenz zurück
`Math.expm1()`	Gibt e hoch der angegebenen Potenz minus 1 zurück
`Math.floor()`	Rundet eine Zahl auf die nächstniedrigere ganze Zahl ab
`Math.fround()`	Gibt die nächste 32-Bit Gleitkommadarstellung einer Zahl zurück
`Math.hypot()`	Gibt die Quadratwurzel der Summe der Quadrate der Argumente zurück
`Math.imul()`	Gibt das 32-Bit Ganzzahlprodukt der beiden Argumente zurück
`Math.log()`	Gibt den natürlichen Logarithmus einer Zahl zurück
`Math.log1p()`	Gibt den natürlichen Logarithmus von 1 plus der angegebenen Zahl zurück
`Math.log10()`	Gibt den dekadischen Logarithmus einer Zahl zurück
`Math.log2()`	Gibt den binären Logarithmus einer Zahl zurück
`Math.max()`	Gibt die größte Zahl aus einer Liste von Zahlen zurück
`Math.min()`	Gibt die kleinste Zahl aus einer Liste von Zahlen zurück
`Math.pow()`	Gibt die Basis hoch der angegebenen Exponenten zurück
`Math.random()`	Gibt eine Zufallszahl zwischen 0 (inklusive) und 1 (exklusive) zurück
`Math.round()`	Rundet eine Zahl zur nächstgelegenen ganzen Zahl
`Math.sign()`	Gibt das Vorzeichen der angegebenen Zahl zurück
`Math.sin()`	Gibt den Sinus einer Zahl zurück
`Math.sinh()`	Gibt den hyperbolischen Sinus einer Zahl zurück
`Math.sqrt()`	Gibt die Quadratwurzel einer Zahl zurück
`Math.tan()`	Gibt den Tangens einer Zahl zurück
`Math.tanh()`	Gibt den hyperbolischen Tangens einer Zahl zurück
`Math.trunc()`	Schneidet die Nachkommastellen einer Zahl ab und gibt die ganze Zahl zurück

Kontrollstrukturen¶

In diesem Kapitel werden die verschiedenen Kontrollstrukturen in JavaScript vorgestellt, die den Programmablauf steuern. Dazu gehören Bedingungen, Schleifen und Ausnahmen.

Bedingungen¶

Die if-Anweisung ermöglicht es, Code nur auszuführen, wenn eine bestimmte Bedingung erfüllt ist. Mit der else-Anweisung kann alternativer Code ausgeführt werden, wenn die Bedingung nicht erfüllt ist. Die else if-Anweisung ermöglicht das Überprüfen mehrerer Bedingungen nacheinander.

if (bedingung1) {
    // Code, der ausgeführt wird, wenn bedingung1 wahr ist
} else if (bedingung2) {
    // Code, der ausgeführt wird, wenn bedingung2 wahr ist
} else {
    // Code, der ausgeführt wird, wenn keine der Bedingungen wahr ist
}

Schleifen¶

In JavaScript gibt es verschiedene Arten von Schleifen:

for-Schleife: Wird verwendet, um eine Schleife mit einer festen Anzahl von Durchläufen auszuführen.
```
for (var i = 0; i < 10; i++) {
    // Code, der 10 Mal ausgeführt wird
}
```

while-Schleife: Führt eine Schleife aus, solange eine bestimmte Bedingung erfüllt ist.

var i = 0;
while (i < 10) {
    // Code, der ausgeführt wird, solange i kleiner als 10 ist
    i++;
}

do-while-Schleife: Führt eine Schleife mindestens einmal aus und dann solange weiter, wie eine bestimmte Bedingung erfüllt ist.
```
var i = 0;
do {
    // Code, der mindestens einmal ausgeführt wird
    i++;
} while (i < 10);
```

for...in-Schleife: Durchläuft die Eigenschaften eines Objekts.

var obj = {a: 1, b: 2, c: 3};
for (var key in obj) {
    // Code, der für jede Eigenschaft des Objekts ausgeführt wird
    console.log(key + ': ' + obj[key]);
}

for...of-Schleife: Durchläuft die Werte eines iterierbaren Objekts (z.B. Arrays oder Strings).

var arr = [1, 2, 3];
for (var value of arr) {
    // Code, der für jeden Wert des Arrays ausgeführt wird
    console.log(value);
}

Ausnahmen¶

JavaScript bietet try-catch-Blöcke, um Ausnahmen (Exceptions) zu behandeln. Wenn im try-Block ein Fehler auftritt, wird der Code im catch-Block ausgeführt.

try {
    // Code, der möglicherweise einen Fehler verursacht
} catch (error) {
    // Code, der ausgeführt wird, wenn ein Fehler auftritt
    console.error('Ein Fehler ist aufgetreten:', error);
}

Zusätzlich gibt es den finally-Block der optional verwendet werden kann und Code enthält, der immer ausgeführt wird, unabhängig davon, ob ein Fehler aufgetreten ist oder nicht.

try {
    // Code, der möglicherweise einen Fehler verursacht
} catch (error) {
    // Code, der ausgeführt wird, wenn ein Fehler auftritt
    console.error('Ein Fehler ist aufgetreten:', error);
} finally {
    // Code, der immer ausgeführt wird
    console.log('Der try-catch-Block wurde abgeschlossen.');
}

Fehler können auch absichtlich mit der throw-Anweisung ausgelöst werden. Dies kann nützlich sein, um eigene Fehlerbedingungen zu definieren und die Fehlerbehandlung an zentraler Stelle zu steuern.

if (bedingung) {
    throw new Error('Eine benutzerdefinierte Fehlermeldung');
}

Mit diesen Kontrollstrukturen kannst du den Ablauf deines JavaScript-Codes effektiv steuern und auf verschiedene Situationen reagieren. Die Kombination dieser Strukturen ermöglicht es, komplexe Anwendungen und Logiken zu entwickeln.

Funktionen in JavaScript¶

Funktionen sind in JavaScript grundlegend und ermöglichen es, Code in wiederverwendbaren Blöcken zu organisieren. Eine Funktion besteht aus einer Reihe von Anweisungen, die eine bestimmte Aufgabe ausführen oder einen Wert berechnen. In diesem Kapitel lernst du, wie du Funktionen definierst und verwendest.

Funktionsdeklaration¶

In JavaScript gibt es mehrere Möglichkeiten, Funktionen zu definieren. Eine der gebräuchlichsten Methoden ist die Funktionsdeklaration:

function meineFunktion(parameter1, parameter2) {
    // Anweisungen, die ausgeführt werden
}

Funktionsexpression¶

Eine andere Möglichkeit, Funktionen in JavaScript zu definieren, ist die Funktionsexpression. Funktionsexpressionen können anonym sein (ohne Namen) oder benannt sein:

// Anonyme Funktionsexpression
var meineFunktion = function(parameter1, parameter2) {
    // Anweisungen, die ausgeführt werden
}

// Benannte Funktionsexpression
var meineFunktion = function meinFunktionsname(parameter1, parameter2) {
    // Anweisungen, die ausgeführt werden
}

Im Unterschied zur Funktionsdeklaration werden Funktionsexpressionen erst ausgewertet, wenn der Code zur Laufzeit auf sie trifft. Das bedeutet, dass eine Funktion, die als Expression definiert ist, nicht vor ihrer Definition aufgerufen werden kann.

Arrow-Funktionen (Pfeilfunktionen)¶

Arrow-Funktionen sind eine weitere Möglichkeit, Funktionen in JavaScript zu definieren. Sie bieten eine verkürzte Syntax und haben einige Unterschiede im Verhalten, insbesondere im Bezug auf das Schlüsselwort this. Arrow-Funktionen sind besonders nützlich, wenn man Funktionen als Argumente an andere Funktionen übergibt, wie zum Beispiel bei Callbacks.

// Arrow-Funktion ohne Parameter
var meineFunktion = () => {
    // Anweisungen, die ausgeführt werden
}

// Arrow-Funktion mit einem Parameter
var meineFunktion = parameter1 => {
    // Anweisungen, die ausgeführt werden
}

// Arrow-Funktion mit mehreren Parametern
var meineFunktion = (parameter1, parameter2) => {
    // Anweisungen, die ausgeführt werden
}

Funktionen aufrufen¶

Um eine Funktion in JavaScript auszuführen, verwende den Funktionsnamen gefolgt von den Argumenten in Klammern. Die Argumente entsprechen den in der Funktion definierten Parametern und werden beim Aufruf der Funktion an die Funktion übergeben.

function addiere(zahl1, zahl2) {
    return zahl1 + zahl2;
}

var ergebnis = addiere(3, 4); // ergebnis ist 7

Funktionen sind in JavaScript First-Class-Objekte, was bedeutet, dass sie wie andere Werte behandelt werden können. Funktionen können als Variablen gespeichert, als Argumente an andere Funktionen übergeben und als Werte von anderen Funktionen zurückgegeben werden. Dies ermöglicht die Verwendung von Funktionen in höherer Ordnung, wie zum Beispiel Funktionen, die andere Funktionen erzeugen oder akzeptieren.

Funktionen bieten in JavaScript eine Vielzahl von Möglichkeiten zur Strukturierung und Wiederverwendung von Code. Sie sind ein grundlegender Bestandteil der Sprache und ermöglichen es, komplexe Anwendungen aufzubauen und zu pflegen.

Objekte in JavaScript¶

In JavaScript sind Objekte Schlüssel-Wert-Paare, die es ermöglichen, komplexe Datenstrukturen und Funktionen zu erstellen und zu verwalten. Objekte können Eigenschaften (Variablen) und Methoden (Funktionen) enthalten. In diesem Kapitel erfährst du, wie du Objekte erstellst und verwendest.

Objekterstellung¶

Es gibt mehrere Möglichkeiten, Objekte in JavaScript zu erstellen:

Objektliteral:

var meinObjekt = {
    eigenschaft1: "Wert1",
    eigenschaft2: 42,
    methode1: function() {
        // Anweisungen
    }
};

Konstruktorfunktion:

function MeinObjekt(eigenschaft1, eigenschaft2) {
    this.eigenschaft1 = eigenschaft1;
    this.eigenschaft2 = eigenschaft2;
    this.methode1 = function() {
        // Anweisungen
    };
}

var meinObjekt = new MeinObjekt("Wert1", 42);

Object.create():

var meinPrototyp = {
    methode1: function() {
        // Anweisungen
    }
};

var meinObjekt = Object.create(meinPrototyp);
meinObjekt.eigenschaft1 = "Wert1";
meinObjekt.eigenschaft2 = 42;

Zugriff auf Eigenschaften und Methoden¶

Du kannst auf die Eigenschaften und Methoden eines Objekts auf verschiedene Weise zugreifen:

Mit der Punktnotation:

console.log(meinObjekt.eigenschaft1); // "Wert1"
meinObjekt.methode1();

Mit der eckigen Klammer Notation:
```
console.log(meinObjekt["eigenschaft1"]); // "Wert1"
meinObjekt["methode1"]();
```
Diese Notation ermöglicht es dir, auf Eigenschaften und Methoden mit dynamischen Schlüsseln zuzugreifen.

Vererbung und Prototypen¶

JavaScript verwendet Prototypen, um Vererbung und Wiederverwendbarkeit von Code zu ermöglichen. Jedes Objekt hat einen internen Verweis auf seinen Prototyp, der wiederum Eigenschaften und Methoden enthalten kann. Wenn du auf eine Eigenschaft oder Methode eines Objekts zugreifst, das nicht vorhanden ist, sucht JavaScript in der Prototypenkette des Objekts nach dem angeforderten Element.

Du kannst die Prototypenkette verwenden, um gemeinsame Methoden und Eigenschaften für mehrere Objekte bereitzustellen, wie im Beispiel mit Object.create() oben gezeigt.

Klassen in JavaScript¶

Ab ECMAScript 2015 (ES6) gibt es in JavaScript die Möglichkeit, Klassen zu definieren. Klassen sind syntaktischer Zucker über der bestehenden Prototypen-basierten Vererbung und bieten eine klarere und einfachere Syntax für die Erstellung von Objekten und die Verwaltung von Vererbung.

Klassendefinition¶

Um eine Klasse zu definieren, verwendest du das Schlüsselwort class, gefolgt vom Klassennamen und einem Codeblock, der die Eigenschaften und Methoden der Klasse enthält:

class MeineKlasse {
    constructor(eigenschaft1, eigenschaft2) {
        this.eigenschaft1 = eigenschaft1;
        this.eigenschaft2 = eigenschaft2;
    }

    methode1() {
        // Anweisungen
    }
}

Der constructor ist eine spezielle Methode, die aufgerufen wird, wenn ein neues Objekt der Klasse erstellt wird. Du kannst Parameter an den Konstruktor übergeben, um die Eigenschaften des Objekts zu initialisieren.

Instanzen erstellen¶

Um ein Objekt aus einer Klasse zu erstellen, verwendest du das Schlüsselwort new, gefolgt vom Klassennamen und den Konstruktor-Argumenten:

var meinObjekt = new MeineKlasse("Wert1", 42);

Vererbung¶

JavaScript unterstützt die Vererbung zwischen Klassen durch das Schlüsselwort extends:

class ErweiterteKlasse extends MeineKlasse {
    constructor(eigenschaft1, eigenschaft2, eigenschaft3) {
        super(eigenschaft1, eigenschaft2);
        this.eigenschaft3 = eigenschaft3;
    }

    methode2() {
        // Anweisungen
    }
}

Die super-Funktion wird verwendet, um den Konstruktor der Basisklasse aufzurufen und die Eigenschaften der Basisklasse zu initialisieren. Du kannst auch auf Methoden der Basisklasse zugreifen und sie überschreiben, indem du die super-Funktion verwendest.

Beispiel:

class ErweiterteKlasse extends MeineKlasse {
    constructor(eigenschaft1, eigenschaft2, eigenschaft3) {
        super(eigenschaft1, eigenschaft2);
        this.eigenschaft3 = eigenschaft3;
    }

    methode1() {
        super.methode1();
        // Weitere Anweisungen
    }

    methode2() {
        // Anweisungen
    }
}

Jetzt hast du einen Überblick über die Verwendung von Klassen in JavaScript erhalten, die dir eine modernere und strukturierte Art bieten, Objekte und Vererbung zu verwalten.

Fehlerbehandlung und Debugging¶

In diesem Kapitel lernst du, wie du mit Fehlern in deinen JavaScript-Skripten umgehst und Techniken anwendest, um Fehler zu finden und zu beheben.

Fehlerarten¶

Es gibt drei Hauptarten von Fehlern in JavaScript:

1. Syntaxfehler (Syntax Errors): Diese Fehler treten auf, wenn der Code falsch geschrieben ist und nicht den Regeln der Sprache folgt. Sie verhindern, dass das Skript ausgeführt wird. 1. Laufzeitfehler (Runtime Errors): Diese Fehler treten während der Ausführung des Skripts auf, z. B. wenn auf eine nicht definierte Variable zugegriffen wird oder wenn eine Funktion aufgerufen wird, die nicht existiert. 1. Logische Fehler (Logical Errors): Diese Fehler treten auf, wenn der Code zwar korrekt ist, aber das gewünschte Ergebnis oder Verhalten nicht erreicht wird.

Fehlerbehandlung¶

Um Fehler in JavaScript effektiv zu behandeln, stehen dir verschiedene Techniken zur Verfügung:

try-catch-Anweisung: Mit dieser Anweisung kannst du einen Block von Code überwachen, der möglicherweise einen Fehler verursacht. Wenn ein Fehler auftritt, wird der Code im catch-Block ausgeführt.
```
try {
    // Code, der möglicherweise einen Fehler verursacht
} catch (error) {
    // Code, der ausgeführt wird, wenn ein Fehler auftritt
}
```

throw-Anweisung: Mit dieser Anweisung kannst du benutzerdefinierte Fehler erstellen und auslösen.
```
if (bedingung) {
    throw new Error("Benutzerdefinierte Fehlermeldung");
}
```

finally-Anweisung: Mit dieser Anweisung kannst du Code ausführen, unabhängig davon, ob im try-Block ein Fehler aufgetreten ist oder nicht.

try {
    // Code, der möglicherweise einen Fehler verursacht
} catch (error) {
    // Code, der ausgeführt wird, wenn ein Fehler auftritt
} finally {
    // Code, der immer ausgeführt wird
}

Debugging-Techniken¶

Da die Konsolenausgabe in eingebetteten Skripten möglicherweise nicht verfügbar ist oder von der Anwendung abhängt, konzentrieren wir uns hier auf andere Debugging-Techniken.

Dein eingebetteter Code lässt sich oft einfach außerhalb der Anwendung ausführen, beispielsweise in einem Webbrowser. Um einen Fehler in einem Skript zu finden, kann es daher hilfreich sein, den Code zunächst außerhalb der Anwendung zu testen und zu debuggen.
Einige Anwendungen enthalten Schnittstellen, mit denen du Ausgaben in die Log-Datei schreiben kannst. Konsultiere die jeweilige Dokumentation, um herauszufinden, wie du diese Schnittstellen verwenden kannst. Nutze sie, um Zwischenergebnisse auszugeben und mögliche Fehlerquellen zu identifizieren.

Best Practices¶

Gute Fehlermeldungen erstellen: Achte darauf, aussagekräftige Fehlermeldungen zu erstellen, die dir und anderen Entwicklern helfen, die Ursache des Fehlers schnell zu finden.
Validierung von Eingabedaten: Überprüfe die Eingabedaten deines Skripts, um sicher zustellen, dass sie gültig sind und den Erwartungen entsprechen, bevor du sie in deinem Code verwendest.
Kommentare und Dokumentation: Schreibe klare Kommentare und dokumentiere deinen Code, um anderen Entwicklern das Verständnis und die Fehlersuche in deinem Skript zu erleichtern.
Modulare Programmierung: Strukturiere deinen Code in kleinere, wiederverwendbare Funktionen und Module. Dies erleichtert das Debugging und die Fehlersuche, da du einzelne Teile deines Codes isoliert testen und überprüfen kannst.

Fazit¶

Fehlerbehandlung und Debugging sind wesentliche Bestandteile der Programmierung in JavaScript. Durch das Verständnis der verschiedenen Fehlerarten und den Einsatz von Techniken wie try-catch-Anweisungen, benutzerdefinierten Fehlern und einfachen Testfällen kannst du Fehler effektiv behandeln und beheben. Außerdem ist es wichtig, Best Practices wie gute Fehlermeldungen, Eingabevalidierung, Kommentare und modulare Programmierung anzuwenden, um die Qualität und Wartbarkeit deines Codes zu verbessern.