TypeScript - Paramètres par défaut

Bonjour à tous, futurs superstars du codage ! Aujourd'hui, nous allons plonger dans le merveilleux monde de TypeScript et explorer une fonctionnalité qui rendra votre vie de programmeur bien plus facile : les paramètres par défaut. D'ici la fin de cette leçon, vous mestrez cette puissance outil comme un pro. Alors, c'est parti !

Qu'est-ce que les paramètres par défaut ?

Imaginez que vous êtes un cuisinier (restez avec moi, on arrive bientôt au codage !). Chaque jour, vous cuisinez une soupe délicieuse. La plupart du temps, vous ajoutez du sel à votre soupe. Mais parfois, un client pourrait demander une soupe sans sel. Ne serait-il pas génial d'avoir une recette qui inclut automatiquement du sel sauf si spécifié autrement ? C'est exactement ce que font les paramètres par défaut dans la programmation !

En TypeScript, les paramètres par défaut vous permettent de définir une valeur par défaut pour un paramètre de fonction. Si la fonction est appelée sans fournir de valeur pour ce paramètre, la valeur par défaut sera utilisée.

Regardons un exemple simple :

function greet(name: string = "World") {
console.log(`Hello, ${name}!`);
}

greet(); // Output: Hello, World!
greet("Alice"); // Output: Hello, Alice!

Dans cet exemple, "World" est le paramètre par défaut pour name. Si nous appelons greet() sans aucun argument, il utilise "World" par défaut. Mais si nous fournissons un nom, comme "Alice", il l'utilise à la place.

Pourquoi utiliser les paramètres par défaut ?

1. Flexibilité : Ils rendent vos fonctions plus flexibles, leur permettant de fonctionner avec ou sans certains arguments.
2. Code plus propre : Ils réduisent le besoin de conditionnels à l'intérieur de votre fonction pour vérifier si un paramètre a été fourni.
3. Lisibilité améliorée : Les paramètres par défaut rendent clair quels sont les valeurs "normales" attendues pour une fonction.

Comment utiliser les paramètres par défaut

Plongons plus profondément avec plus d'exemples :

Utilisation de base

function calculateArea(width: number = 10, height: number = 5) {
return width * height;
}

console.log(calculateArea()); // Output: 50
console.log(calculateArea(20)); // Output: 100
console.log(calculateArea(7, 3)); // Output: 21

Dans cet exemple, width et height ont des valeurs par défaut. Nous pouvons appeler la fonction sans arguments, avec un argument (qui sera utilisé pour width), ou avec les deux arguments.

Utilisation d'expressions comme valeurs par défaut

Les paramètres par défaut peuvent être des expressions, pas seulement des valeurs simples :

function getRandomGreeting(name: string = "friend", time: Date = new Date()) {
const greetings = ["Hello", "Hi", "Hey", "Howdy"];
const randomGreeting = greetings[Math.floor(Math.random() * greetings.length)];
return `${randomGreeting}, ${name}! It's ${time.toLocaleTimeString()} now.`;
}

console.log(getRandomGreeting()); // Output: par ex., "Hey, friend! It's 3:45:30 PM now."
console.log(getRandomGreeting("Alice")); // Output: par ex., "Hello, Alice! It's 3:45:35 PM now."

Ici, nous utilisons new Date() comme valeur par défaut pour time, ce qui nous donnera la date et l'heure actuelles lorsque la fonction est appelée.

Paramètres par défaut avec d'autres types

Les paramètres par défaut fonctionnent avec tous les types en TypeScript :

function createUser(
name: string = "Anonymous",
age: number = 0,
isAdmin: boolean = false,
hobbies: string[] = []
) {
return { name, age, isAdmin, hobbies };
}

console.log(createUser());
// Output: { name: "Anonymous", age: 0, isAdmin: false, hobbies: [] }

console.log(createUser("Alice", 30, true, ["reading", "coding"]));
// Output: { name: "Alice", age: 30, isAdmin: true, hobbies: ["reading", "coding"] }

Cet exemple montre comment les paramètres par défaut peuvent être utilisés avec différents types, y compris les tableaux et les booléens.

Paramètres optionnels vs paramètres par défaut

Maintenant, vous pourriez penser : "Attendez une minute ! J'ai entendu parler de paramètres optionnels. Comment sont-ils différents des paramètres par défaut ?" Excellent pregunta ! Mettons-nous dedans :

Paramètres optionnels

Les paramètres optionnels sont marqués avec un ? et permettent d'appeler une fonction sans fournir de valeur pour ce paramètre.

function greetOptional(name?: string) {
if (name) {
console.log(`Hello, ${name}!`);
} else {
console.log("Hello, stranger!");
}
}

greetOptional(); // Output: Hello, stranger!
greetOptional("Bob"); // Output: Hello, Bob!

Paramètres par défaut

Les paramètres par défaut fournissent une valeur par défaut qui sera utilisée si aucun argument n'est fourni.

function greetDefault(name: string = "stranger") {
console.log(`Hello, ${name}!`);
}

greetDefault(); // Output: Hello, stranger!
greetDefault("Bob"); // Output: Hello, Bob!

Clés différences

Fonctionnalité	Paramètres optionnels	Paramètres par défaut
Syntaxe	Utilise ? après le nom du paramètre	Utilise = value après le type du paramètre
Quand aucun argument n'est fourni	Le paramètre est undefined	Le paramètre utilise la valeur par défaut
Besoin de vérifications null	Souvent nécessite des vérifications dans le corps de la fonction	Aucune vérification supplémentaire nécessaire
Clarté de l'intention	Moins clair ce qui se passe si le paramètre est omis	Montre clairement le comportement par défaut

En général, les paramètres par défaut sont souvent plus pratiques et conduisent à un code plus propre, car ils éliminent le besoin de vérifications null à l'intérieur du corps de la fonction.

Meilleures pratiques pour utiliser les paramètres par défaut

1. Utilisez des valeurs par défaut significatives : Choisissez des valeurs par défaut qui ont du sens pour la plupart des cas d'utilisation de votre fonction.
2. Documentez vos valeurs par défaut : Même si la valeur par défaut est dans le code, il est bon de la mentionner dans la documentation de votre fonction.
3. Soyez prudent avec les objets mutables : Évitez d'utiliser des objets mutables comme valeurs par défaut, car ils peuvent entraîner un comportement inattendu.
4. Pensez à undefined : Souvenez-vous que undefined déclenchera la valeur par défaut, mais null ne le fera pas.

function exampleBestPractices(
requiredParam: string,
optionalParam: string = "default value",
anotherOptional: number = 42
) {
// Corps de la fonction
}

Conclusion

Et voilà, les amis ! Vous avez juste amélioré vos compétences en TypeScript en maîtrisant les paramètres par défaut. Souvenez-vous, comme avec n'importe quel outil en programmation, les paramètres par défaut sont les plus puissants lorsqu'ils sont utilisés avec discernement. Ils peuvent rendre votre code plus robuste, lisible et flexible.

Alors que vous continuez votre parcours de codage, vous trouverez de nombreuses occasions d'utiliser les paramètres par défaut. Peut-être créerez-vous une fonction pour calculer les frais de livraison avec une méthode d'expédition par défaut, ou une fonction pour formater les dates avec un format de chaîne par défaut. Les possibilités sont infinies !

Continuez à vous entraîner, continuez à coder, et surtout, continuez à vous amuser avec TypeScript. Jusqu'à la prochaine fois, bon codage !

Credits: Image by storyset