TypeScript: Arrays erstellen und manipulieren

Die statische Typisierung ermöglicht es dem TypeScript-Compiler, den Datentyp der Array-Elemente zu überwachen. Dadurch reduzieren TypeScript Arrays die Fehleranfälligkeit in Ihrem Code, sodass Sie sichere und zuverlässigere Anwendungen entwickeln können.

Was sind TypeScript Arrays?

In TypeScript sind Arrays geordnete Listen von Werten. Wie in JavaScript können Sie in TypeScript Arrays verwenden, um eine Sammlung von Elementen zu speichern. Diese Elemente dürfen verschiedene Datentypen haben, einschließlich Zahlen, Zeichenketten, Objekte oder anderer Arrays. TypeScript bietet den Vorteil, dass es statische Typisierung unterstützt, was bedeutet, dass Sie den Datentyp der Elemente in einem Array festlegen können. Das verbessert die Fehlererkennung bei der Entwicklung.

Eine entscheidende Eigenschaft von Arrays ist ihre dynamische Größe. So können Sie Elemente hinzufügen oder entfernen, ohne im Voraus die Größe bestimmen zu müssen. In TypeScript sind Arrays standardmäßig veränderbar. Sie können aber unveränderliche (immutable) Arrays erstellen, indem Sie Array-Methoden wie map und filter verwenden, um neue Arrays basierend auf bestehenden Arrays zu erstellen. Arrays erleichtern das Filtern, Sortieren und die Iteration über Elemente und bieten eine konsistente Struktur zur Datenorganisation.

Darüber hinaus können TypeScript Arrays als Grundlage für die Implementierung von Datenstrukturen wie Stapeln (LIFO – Last-In-First-Out) und Warteschlangen (FIFO – First-In-First-Out) dienen. Sie eignen sich auch zur Repräsentation von Listen, Tabellen und Sammlungen in einer Vielzahl von Anwendungen. Durch die einfache Verwaltung von Elementen desselben Typs sind Arrays besonders nützlich beim Verarbeiten von Daten aus externen Quellen, sei es von APIs oder Datenbanken.

Das ist die Syntax von TypeScript Arrays

In TypeScript werden Arrays mit den Schlüsselwörtern let, const oder var gefolgt von einem Variablennamen und einer Datentyp-Angabe deklariert. Die Erklärung des Datentyps erfolgt mit einem Doppelpunkt und gibt an, welchen Datentyp die Elemente im Array haben sollen. Diese Elemente werden in eckigen Klammern und durch Kommas getrennt in einem Array-Initialisierungsblock platziert.

Die allgemeine Syntax für die Deklaration eines TypeScript Arrays sieht wie folgt aus:

const variableName: datatype[] = [element1, element2, ...];

• variableName ist der von Ihnen gewählte Name für das Array.
• datatype gibt an, welchen Datentyp die Elemente im Array haben sollen.
• [element1, element2, …] sind die tatsächlichen Elemente oder Werte, die im Array gespeichert werden sollen. Diese Elemente sollten den zuvor definierten Datentyp besitzen.

Hier sind Beispiele zur Veranschaulichung der Syntax:

// Data type: Number
const numbers: number[] = [1, 2, 3, 4, 5];
// Data type: String
const numbers: string[] = ["Alice", "Bob", "Charlie"];
// Data type: Boolean
const booleans: boolean[] = [true, false];

TypeScript-Array-Methoden

TypeScript-Array-Methoden sind äußerst nützlich und leistungsstark, da sie Ihnen erlauben, Daten in Arrays auf effiziente Weise zu verarbeiten, zu transformieren und zu organisieren. Die folgende Tabelle gibt Ihnen einen Überblick über gängige Array-Methoden in TypeScript und ihre Anwendungsbereiche.

Beispiele für den Einsatz von TypeScript Arrays

TypeScript Arrays sind unerlässliche Werkzeuge, wenn es darum geht, Daten in Anwendungen zu organisieren und zu verarbeiten. Wir stellen Ihnen einige der wichtigsten Arbeitsschritte vor.

Auf Array-Elemente zugreifen

Der Zugriff auf Array-Elemente in TypeScript ist eine grundlegende Operation, die es Ihnen ermöglicht, spezifische Elemente innerhalb eines Arrays abzurufen. Sie können auf Array-Elemente mithilfe ihres Index zugreifen, der ihre Position im Array darstellt. In TypeScript ist die Indexierung von Arrays nullbasiert. Das erste Element hat demzufolge den Index 0 und das zweite Element den Index 1.

let myArray: number[] = [10, 20, 30, 40, 50];
// Accessing elements using index
let firstElement: number = myArray[0]; // Output: 10
let secondElement: number = myArray[1]; // Output: 20
let thirdElement: number = myArray[2]; // Output: 30
// Assigning a new value to an array element
myArray[3] = 99; // 4th element in myArray = 99

Array-Destrukturierung

Mit Array-Destrukturierung in TypeScript können Sie Werte aus einem Array schnell und einfach extrahieren und sie Variablen zuweisen.

let numberArray: number[] = [1, 2, 3];
// Array destructuring
let [firstNumber, secondNumber, thirdNumber] = numberArray;
// Access values
console.log(firstNumber); // Outputs 1
console.log(secondNumber); // Outputs 2
console.log(thirdNumber); // Outputs 3

Iteration über Elemente in TypeScript Arrays

Hier ist ein Beispiel für eine Iteration über ein Array in TypeScript mithilfe einer for-Schleife:

let numbers: number[] = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
}

In diesem Beispiel haben wir ein Array numbers, das Zahlen enthält. Wir verwenden eine for-Schleife, um durch das Array zu iterieren. Die Schleife beginnt bei i = 0, und wir erhöhen i in jedem Schleifendurchlauf. Mit numbers[i] greifen wir auf das jeweilige Element des Arrays zu und geben es aus.

Wir erhalten die Ausgabe:

1
2
3
4
5