TypeScript - Operatoren

Hallo, zukünftige Programmierer! Heute machen wir uns auf eine aufregende Reise in die Welt der TypeScript-Operatoren. Als Ihr freundlicher Nachbarschafts-Computerlehrer bin ich hier, um Sie Schritt für Schritt durch dieses Abenteuer zu führen. Also, schnallen Sie sich an und tauchen wir ein!

TypeScript - Operators

Was ist ein Operator?

Bevor wir unsere Odyssee der TypeScript-Operatoren beginnen, lassen Sie uns verstehen, was ein Operator eigentlich ist. Stellen Sie sich Operatoren als spezielle Symbole vor, die dem Computer mitteilen, bestimmte mathematische oder logische Manipulationen durchzuführen. Sie sind wie die magischen Zauberstäbe der Programmierung, die unsere Daten auf verschiedene Weisen transformieren und kombinieren.

Zum Beispiel ist das "+"-Zeichen in Ihrem Code nicht nur eine schicke Dekoration. Es ist ein Operator, der den Computer anweist, Dinge zusammenzuzählen. Cool, oder?

Arithmetische Operatoren

Lassen Sie uns mit den arithmetischen Operatoren beginnen. Diese sind wahrscheinlich den meisten von Ihnen vertraut, da sie ähnlich sind wie das, was Sie im Mathematikunterricht verwendet haben.

Hier ist eine Tabelle der arithmetischen Operatoren in TypeScript:

Operator Beschreibung Beispiel
+ Addition 5 + 3
- Subtraktion 7 - 2
* Multiplikation 4 * 6
/ Division 8 / 2
% Modulus (Rest) 9 % 4
++ Inkrement let x = 5; x++;
-- Dezrement let y = 3; y--;

Sehen wir uns diese in Aktion an:

let a: number = 10;
let b: number = 5;

console.log(a + b);  // Ausgabe: 15
console.log(a - b);  // Ausgabe: 5
console.log(a * b);  // Ausgabe: 50
console.log(a / b);  // Ausgabe: 2
console.log(a % b);  // Ausgabe: 0

let c: number = 7;
c++;
console.log(c);  // Ausgabe: 8

let d: number = 3;
d--;
console.log(d);  // Ausgabe: 2

In diesem Beispiel führen wir verschiedene arithmetische Operationen auf unseren Variablen durch. Der Modulus-Operator (%) könnte für einige von Ihnen neu sein. Er gibt uns den Rest nach der Division. Also ist 10 % 5 0, weil 10 durch 5 keinen Rest übrig lässt.

Relationale Operatoren

Als nächstes haben wir die relationalen Operatoren. Diese werden verwendet, um Werte zu vergleichen und basierend auf dem Vergleich true oder false zurückzugeben.

Hier ist eine Tabelle der relationalen Operatoren:

Operator Beschreibung Beispiel
== Gleich 5 == 5
!= Ungleich 5 != 3
> Größer als 7 > 3
< Kleiner als 2 < 8
>= Größer oder gleich 5 >= 5
<= Kleiner oder gleich 4 <= 4

Sehen wir uns an, wie diese funktionieren:

let x: number = 5;
let y: number = 10;

console.log(x == y);  // Ausgabe: false
console.log(x != y);  // Ausgabe: true
console.log(x > y);   // Ausgabe: false
console.log(x < y);   // Ausgabe: true
console.log(x >= 5);  // Ausgabe: true
console.log(y <= 10); // Ausgabe: true

Diese Operatoren sind super nützlich, wenn Sie in Ihrem Code Entscheidungen basierend auf dem Vergleich von Werten treffen müssen.

Logische Operatoren

Logische Operatoren werden verwendet, um die Logik zwischen Variablen oder Werten zu bestimmen. Sie sind wie die Sherlock Holmes der Programmierung, die uns dabei helfen, Wahrheiten aus mehreren Bedingungen zu erschließen.

Hier ist eine Tabelle der logischen Operatoren:

Operator Beschreibung Beispiel
&& Logisches UND true && false
|| Logisches ODER true || false
! Logisches NICHT !true

Sehen wir uns diese in Aktion an:

let isRaining: boolean = true;
let isWarm: boolean = false;

console.log(isRaining && isWarm);  // Ausgabe: false
console.log(isRaining || isWarm);  // Ausgabe: true
console.log(!isRaining);           // Ausgabe: false

In diesem Beispiel gibt && nur true zurück, wenn beide Bedingungen wahr sind. || gibt true zurück, wenn mindestens eine Bedingung wahr ist. ! negiert den booleschen Wert.

Bitwise Operatoren

Jetzt begeben wir uns in ein fortgeschritteneres Terrain. Bitwise Operatoren führen Operationen auf binären Darstellungen von Zahlen durch. Machen Sie sich keine Sorgen, wenn das komplex klingt - wir werden es zusammen auseinandernehmen!

Hier ist eine Tabelle der bitwise Operatoren:

Operator Beschreibung Beispiel
& Bitwise UND 5 & 3
| Bitwise ODER 5 | 3
^ Bitwise XOR 5 ^ 3
~ Bitwise NICHT ~5
<< Linksshift 5 << 1
>> Rechsshift 5 >> 1

Sehen wir uns ein Beispiel an:

let a: number = 5;  // binär: 0101
let b: number = 3;  // binär: 0011

console.log(a & b);  // Ausgabe: 1 (binär: 0001)
console.log(a | b);  // Ausgabe: 7 (binär: 0111)
console.log(a ^ b);  // Ausgabe: 6 (binär: 0110)
console.log(~a);     // Ausgabe: -6 (binär: 1010 in Zweierkomplement)
console.log(a << 1); // Ausgabe: 10 (binär: 1010)
console.log(a >> 1); // Ausgabe: 2 (binär: 0010)

Diese Operatoren arbeiten auf der binären (base-2) Darstellung von Zahlen. Sie sind besonders nützlich in Low-Level-Programmierung und bestimmten Algorithmen.

Zuweisungsoperatoren

Zuweisungsoperatoren werden verwendet, um Werte an Variablen zuweisen. Sie sind wie die Umzugshelfer der Programmierung, die Werte in ihre richtigen Häuser (Variablen) einziehen lassen.

Hier ist eine Tabelle der Zuweisungsoperatoren:

Operator Beschreibung Beispiel
= Zuweisen x = 5
+= Addieren und zuweisen x += 3
-= Subtrahieren und zuweisen x -= 2
*= Multiplizieren und zuweisen x *= 4
/= Teilen und zuweisen x /= 2
%= Modulus und zuweisen x %= 3

Sehen wir uns diese in Aktion an:

let x: number = 10;

x += 5;  // äquivalent zu: x = x + 5
console.log(x);  // Ausgabe: 15

x -= 3;  // äquivalent zu: x = x - 3
console.log(x);  // Ausgabe: 12

x *= 2;  // äquivalent zu: x = x * 2
console.log(x);  // Ausgabe: 24

x /= 4;  // äquivalent zu: x = x / 4
console.log(x);  // Ausgabe: 6

x %= 4;  // äquivalent zu: x = x % 4
console.log(x);  // Ausgabe: 2

Diese Operatoren sind Abkürzungen, die unseren Code kürzer und lesbarer machen.

Diverse Operatoren

TypeScript hat auch einige andere Operatoren, die nicht gut in die vorherigen Kategorien passen.

Hier ist eine Tabelle einiger diverser Operatoren:

Operator Beschreibung Beispiel
?: Bedingter (ternärer) condition ? expr1 : expr2
, Komma let x = (1, 2, 3)
delete Eigenschaft löschen delete obj.property
typeof Typ einer Variablen typeof x
void Ausdruck auswerten und undefined zurückgeben void(0)

Sehen wir uns ein Beispiel des ternären Operators an, der quite nützlich ist:

let age: number = 20;
let canVote: string = age >= 18 ? "Ja" : "Nein";
console.log(canVote);  // Ausgabe: "Ja"

Dies ist eine Abkürzung für eine if-else-Anweisung. Wenn die Bedingung (age >= 18) wahr ist, wird "Ja" zurückgegeben, anderenfalls "Nein".

Typoperatoren

Schließlich schauen wir uns einige Operatoren an, die spezifisch für TypeScript sind und uns dabei helfen, mit Typen zu arbeiten.

Hier ist eine Tabelle der Typoperatoren:

Operator Beschreibung Beispiel
typeof Den Typ einer Variablen erhalten typeof x
instanceof Überprüfen, ob ein Objekt eine Instanz einer Klasse ist obj instanceof Class
as Typannahme (someValue as string).toUpperCase()
Typannahme (alternative Syntax) (someValue).toUpperCase()

Sehen wir uns ein Beispiel an:

let x: any = "Hallo, TypeScript!";
let length: number = (x as string).length;
console.log(length);  // Ausgabe: 20

class Animal {}
class Dog extends Animal {}

let myPet = new Dog();
console.log(myPet instanceof Animal);  // Ausgabe: true

In diesem Beispiel verwenden wir eine Typannahme, um TypeScript mitzuteilen, dass wir wissen, dass x ein String ist, auch wenn er als any typisiert ist. Wir verwenden auch instanceof, um zu überprüfen, ob myPet eine Instanz der Animal-Klasse ist.

Und das war's, Leute! Wir haben die Welt der TypeScript-Operatoren bereist. Erinnern Sie sich daran, dass Übung den Meister macht, also fürchten Sie sich nicht, diese Operatoren in Ihrem eigenen Code auszuprobieren. Frohes Coden!

Credits: Image by storyset