Menu
CoddyTech

Typage des fonctions fléchées

Fait partie de la section Introduction à TypeScript du Journey JavaScript de Coddy. Leçon 23 sur 73.

Pour les fonctions fléchées, vous ajoutez des annotations de type aux paramètres à l'intérieur des parenthèses, tout comme pour les fonctions régulières. L'annotation du type de retour se place après la liste des paramètres mais avant la flèche (=>) :

const multiply = (a: number, b: number): number => {
  return a * b;
};

const greet = (name: string): string => `Hello, ${name}!`;

La différence clé par rapport aux déclarations de fonction régulières est que l'annotation de type de retour apparaît avant la flèche plutôt qu'après le nom de la fonction. Cela maintient la sécurité de type de TypeScript tout en préservant la syntaxe propre et moderne qui rend les fonctions fléchées populaires.

challenge icon

Défi

Facile

Convertissez la déclaration de fonction régulière suivante en une fonction fléchée tout en conservant toutes les annotations de type :

function subtract(a: number, b: number): number {
  return a - b;
}

Créez une fonction fléchée nommée subtract qui effectue la même opération avec les mêmes types de paramètres et le même type de retour.

Ensuite, créez deux fonctions fléchées supplémentaires :

  • Une fonction fléchée nommée createMessage qui prend un paramètre text de type string et retourne une chaîne de caractères au format "Message: [text]". Incluez des annotations de type explicites pour le paramètre et le type de retour.
  • Une fonction fléchée nommée isPositive qui prend un paramètre num de type number et retourne true si le nombre est supérieur à 0, sinon false. Incluez des annotations de type explicites pour le paramètre et le type de retour.

Testez vos fonctions fléchées en les appelant avec les valeurs suivantes et en affichant les résultats :

  • Appelez subtract avec 10 et 3
  • Appelez createMessage avec "Hello World"
  • Appelez isPositive avec -5
  • Appelez isPositive avec 8

Affichez chaque résultat sur une ligne distincte dans l'ordre spécifié ci-dessus.

Essayez vous-même

// TODO : Convertir la fonction régulière en fonction fléchée et créer les fonctions fléchées supplémentaires

// TODO : Créer la fonction fléchée subtract avec des annotations de type

// TODO : Créer la fonction fléchée createMessage avec des annotations de type

// TODO : Créer la fonction fléchée isPositive avec des annotations de type

// TODO : Tester vos fonctions fléchées et afficher les résultats
quiz iconTestez-vous

Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.

Toutes les leçons de Introduction à TypeScript

Entraînez-vous par vous-même : Playground TypeScript