Maison >interface Web >js tutoriel >Comprendre le curry JavaScript avec une application du monde réel

Comprendre le curry JavaScript avec une application du monde réel

Patricia Arquette
Patricia Arquetteoriginal
2025-01-20 14:33:11211parcourir

Understanding JavaScript Currying with a Real-World Application

Avez-vous déjà rencontré le « currying » en JavaScript et vous êtes-vous demandé quel était son objectif ? Cet article démystifie le curry, illustrant ses avantages avec des exemples simples et une application pratique qui améliore la clarté et la flexibilité du code.

? Qu’est-ce que le curry ?

Le currying, une technique de programmation fonctionnelle, implique le traitement des arguments de fonction de manière séquentielle plutôt que d'un seul coup. Une fonction curry génère une autre fonction, attendant le paramètre suivant jusqu'à ce que tous les arguments soient fournis. Essentiellement, il transforme une fonction multi-arguments en une séquence de fonctions à un seul argument.

Illustrons avec une analogie et un code du monde réel :

? Construire un hamburger

Imaginez commander un hamburger. Le chef l'assemble couche par couche :

Couche 1 : Bun (premier argument) Couche 2 : Patty (deuxième argument) Couche 3 : Toppings (troisième argument)

Voici comment cela se traduit en code utilisant des fonctions régulières et curry :

? Fonction régulière : Tous les ingrédients sont passés simultanément.

<code class="language-javascript">function makeBurger(bun, patty, topping) {
    return `Your burger includes: ${bun} bun, ${patty} patty, and ${topping} topping.`;
}

const myBurger = makeBurger("Sesame", "Beef", "Cheese");
console.log(myBurger); // Output: Your burger includes: Sesame bun, Beef patty, and Cheese topping.</code>

? Fonction curry : Les ingrédients sont ajoutés un à la fois.

<code class="language-javascript">function makeBurgerCurried(bun) {
    return function (patty) {
        return function (topping) {
            return `Your burger includes: ${bun} bun, ${patty} patty, and ${topping} topping.`;
        };
    };
}

// Usage example
const selectBun = makeBurgerCurried("Sesame");
const selectPatty = selectBun("Beef");
const myCurriedBurger = selectPatty("Cheese");

console.log(myCurriedBurger); // Output: Your burger includes: Sesame bun, Beef patty, and Cheese topping.</code>

✍️ Explication :

Premier Appel : makeBurgerCurried("Sesame") reçoit "Sésame" et renvoie une fonction en attente de la galette.

Deuxième appel : selectBun("Beef") reçoit "Bœuf" et renvoie une fonction en attente de la garniture.

Troisième appel : selectPatty("Cheese") reçoit « Cheese », complétant la séquence et renvoyant la description du hamburger.

⭐ Curry simplifié avec fonctions fléchées

Les fonctions fléchées offrent une approche plus concise :

<code class="language-javascript">const curriedArrow = (bun) => (patty) => (topping) =>
    `Your burger includes: ${bun} bun, ${patty} patty, and ${topping} topping`;

const myArrowBurger = curriedArrow("Sesame")("Beef")("Cheese");
console.log(myArrowBurger); // Your burger includes: Sesame bun, Beef patty, and Cheese topping</code>

⁉️Pourquoi utiliser le curry ?

Currying excelle dans les scénarios nécessitant la réutilisation de fonctions avec des arguments prédéfinis. Il améliore la réutilisabilité, la lisibilité et la modularité du code.

? Application réelle : calculateur de remise dynamique

Envisagez une plateforme de commerce électronique avec des remises échelonnées :

  • Clients réguliers : 10 % de réduction
  • Clients Premium : 20 % de réduction

Comparons les implémentations de fonctions régulières et curry :

? Fonction régulière : Moins flexible et réutilisable.

<code class="language-javascript">function calculateDiscount(customerType, price) {
    if (customerType === "Regular") return price * 0.9;
    else if (customerType === "Premium") return price * 0.8;
}

console.log(calculateDiscount("Regular", 100)); // Output: 90
console.log(calculateDiscount("Premium", 100)); // Output: 80</code>

? Fonction curry : Hautement réutilisable et adaptable.

<code class="language-javascript">function createDiscountCalculator(discountRate) {
    return function (price) {
        return price * (1 - discountRate);
    };
}

const regularDiscount = createDiscountCalculator(0.1);
const premiumDiscount = createDiscountCalculator(0.2);

console.log(regularDiscount(100)); // Output: 90
console.log(premiumDiscount(100)); // Output: 80
console.log(regularDiscount(200)); // Output: 180</code>

L'ajout de nouveaux types de clients est simple :

<code class="language-javascript">const studentDiscount = createDiscountCalculator(0.15);
console.log(studentDiscount(100)); // Output: 85</code>

Conclusion

Bien qu'il semble initialement complexe, le currying simplifie la conception des fonctions, améliore la clarté du code et favorise la réutilisabilité. Intégrez le curry à vos projets pour découvrir ses avantages.

Partagez vos expériences avec le curry dans les commentaires ci-dessous ! Bon codage ! ✨

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!

Déclaration:
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