Maison > interface Web > js tutoriel > Maîtriser les fonctions TypeScript : votre guide pour un code plus fort et plus sûr

Maîtriser les fonctions TypeScript : votre guide pour un code plus fort et plus sûr

王林
Libérer: 2024-07-25 08:30:14
original
1102 Les gens l'ont consulté

Mastering TypeScript Functions: Your Guide to Stronger, Safer Code

TypeScript améliore les fonctions JavaScript avec de puissantes capacités de vérification de type. Explorons les fonctionnalités clés qui font des fonctions TypeScript un outil essentiel pour le développement Web moderne.

  • Syntaxe des fonctions de base : TypeScript vous permet de spécifier des types de paramètres et des types de retour, rendant ainsi claires les intentions de votre fonction.
function greet(name: string): string {
  return `Hello, ${name}!`;
}
Copier après la connexion

Cette fonction prend un paramètre de chaîne et garantit une valeur de retour de chaîne.

  • Fonctions des flèches : Les fonctions fléchées fournissent une syntaxe concise et une portée lexicale de « ceci ».
const multiply = (a: number, b: number): number => a * b;
Copier après la connexion

Ici, nous définissons une fonction qui prend deux nombres et renvoie leur produit.

  • Paramètres facultatifs et par défaut : TypeScript vous permet de définir des paramètres facultatifs et de définir des valeurs par défaut.
function createUser(name: string, age?: number, role: string = 'user') {
  // Implementation
}
Copier après la connexion

Dans cet exemple, « âge » est facultatif et « rôle » a une valeur par défaut de « utilisateur ».

  • Paramètres de repos : Les paramètres de repos permettent à une fonction d'accepter un nombre indéfini d'arguments sous forme de tableau.
function sum(...numbers: number[]): number {
  return numbers.reduce((total, num) => total + num, 0);
}
Copier après la connexion

Cette fonction peut prendre n'importe quel nombre d'arguments numériques et renvoyer leur somme.

  • Surcharge de fonctions : La surcharge de fonctions vous permet de définir plusieurs signatures de fonction pour un comportement varié.
function processInput(input: string): string;
function processInput(input: number): number;
function processInput(input: string | number): string | number {
  if (typeof input === 'string') {
    return input.toUpperCase();
  } else {
    return input * 2;
  }
}
Copier après la connexion

Cette fonction peut gérer à la fois les entrées de chaîne et de nombre, avec un comportement différent pour chacune.

  • Fonctions génériques : Les génériques vous permettent de créer des fonctions flexibles et réutilisables qui fonctionnent avec plusieurs types.
function firstElement<T>(arr: T[]): T | undefined {
  return arr[0];
}
Copier après la connexion

Cette fonction générique peut fonctionner avec des tableaux de n'importe quel type et renvoyer le premier élément de ce type.

Les fonctions TypeScript fournissent une base solide pour créer des applications complexes. En tirant parti de ces fonctionnalités, vous pouvez écrire du code plus expressif, plus sûr et auto-documenté.

Rappelez-vous : l'objectif n'est pas seulement d'ajouter des types, mais d'utiliser les fonctionnalités de TypeScript pour créer des structures de code plus fiables et plus maintenables.

J'espère que vous avez appris quelque chose de nouveau dans ce court blog. :)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal