TypeScript Arrays : comment créer et manipuler des tableaux TypeScript ?

Le typage statique permet au compilateur TypeScript de surveiller le type de données des éléments d’un tableau. Les TypeScript Arrays réduisent ainsi le risque d’erreurs dans votre code, ce qui vous permet de développer des applications plus sûres et plus fiables.

TypeScript Arrays : définition et explication

En TypeScript, les tableaux sont appelés Arrays. Il s’agit en fait de listes ordonnées de valeurs permettant, comme en JavaScript, de stocker une collection d’éléments. Ces éléments peuvent avoir différents types de données, y compris des nombres, des chaînes de caractères, des objets ou même d’autres tableaux. TypeScript présente l’avantage de supporter le typage statique, ce qui signifie que vous pouvez définir le type de données des éléments dans un tableau. Cela améliore notamment la détection des erreurs lors du développement.

Une caractéristique décisive des tableaux est leur taille dynamique. Cela vous permet d’ajouter ou de supprimer des éléments sans avoir à déterminer leur taille à l’avance. Les TypeScript Arrays sont modifiables par défaut, mais vous pouvez également créer des tableaux immuables en utilisant des méthodes comme map et filter.

Les tableaux facilitent le filtrage, le tri et l’itération sur les éléments et fournissent une structure cohérente pour l’organisation des données. De plus, ils peuvent servir de base à l’implémentation de structures de données telles que les piles (LIFO, Last-In-First-Out) et les files d’attente (FIFO, First-In-First-Out). Ils conviennent aussi à la représentation de listes, de tableaux et de collections dans une multitude d’applications. En facilitant la gestion d’éléments du même type, les tableaux sont particulièrement utiles pour traiter des données provenant de sources externes, qu’il s’agisse d’API ou de bases de données.

TypeScript Arrays : quelle syntaxe ?

En TypeScript, les tableaux sont déclarés avec les mots-clés let, const ou var suivis d’un nom de variable et d’une indication de type de données. La déclaration du type de données se fait par deux points et indique le type de données que les éléments du tableau doivent avoir. Ces éléments sont placés entre crochets et séparés par des virgules dans un bloc d’initialisation du tableau.

La syntaxe générale pour déclarer un tableau TypeScript se présente comme suit :

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

• variableName : le nom que vous avez choisi pour le tableau
• datatype : le type de données que les éléments du tableau doivent avoir
• [element1, element2, …] : les éléments ou valeurs réels qui doivent être stockés dans le tableau. Ces éléments doivent avoir le type de données défini précédemment

Voici plusieurs exemples pour illustrer la syntaxe :

// 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 Arrays : les méthodes de tableaux à connaître

Les méthodes de tableau TypeScript sont extrêmement utiles et puissantes, car elles vous permettent de traiter, de transformer et d’organiser efficacement des données dans des tableaux. Le tableau suivant vous donne un aperçu des méthodes courantes dans TypeScript et de leurs domaines d’application.

TypeScript Arrays : exemples d’utilisation

Les tableaux TypeScript sont des outils indispensables lorsqu’il s’agit d’organiser et de traiter des données dans des applications. Nous vous présentons quelques-unes des principales opérations.

Accès aux éléments d’un tableau

L’accès aux éléments d’un tableau dans TypeScript est une opération de base qui vous permet de récupérer des éléments spécifiques dans un tableau. Vous pouvez accéder aux éléments d’un tableau à l’aide de leur index, qui représente leur position dans le tableau. En TypeScript, l’indexation des tableaux est basée sur le zéro. Le premier élément a donc l’index 0 et le deuxième l’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

Déstructuration d’un tableau

La déstructuration de tableau en TypeScript permet d’extraire rapidement et facilement des valeurs d’un tableau et de les affecter à des variables.

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

Itération sur les éléments dans les tableaux TypeScript

Voici un exemple d’itération sur un tableau en TypeScript à l’aide d’une boucle for :

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

Dans cet exemple, nous avons un tableau numbers contenant des nombres. Nous utilisons une boucle for pour itérer dans le tableau. La boucle commence à i = 0 et nous augmentons i à chaque passage de la boucle. Avec numbers[i], nous accédons à l’élément respectif du tableau et le retournons.

Nous obtenons alors la sortie :

1
2
3
4
5