CodeGym /Cours Java /Frontend SELF FR /Paramètres des fonctions

Paramètres des fonctions

Frontend SELF FR
Niveau 35 , Leçon 3
Disponible

4.1 Paramètres des fonctions

Les paramètres des fonctions en JavaScript permettent de passer des valeurs aux fonctions pour qu'elles les traitent. Cela rend les fonctions plus flexibles et adaptatives. Dans ce cadre, on va voir les aspects principaux du travail avec les paramètres de fonctions en JavaScript, sans inclure les paramètres par défaut et les paramètres rest.

Les paramètres sont indiqués entre parenthèses après le nom de la fonction. Lors de l'appel de la fonction, les valeurs de ces paramètres sont passées aux variables correspondantes à l'intérieur de la fonction.

Exemple :

Dans la fonction greet(), deux paramètres sont définis : name et age. Lors de l'appel de la fonction, les valeurs Alice et 30 sont transmises à ces paramètres.

JavaScript
    
      function greet(name, age) {
        return `Hello, ${name}! You are ${age} years old.`;
      }
      console.log(greet('Alice', 30)); // "Hello, Alice! You are 30 years old."
    
  

Gestion des paramètres indéfinis

Si un paramètre n'est pas transmis lors de l'appel de la fonction, sa valeur sera undefined. Cela peut conduire à des erreurs si des opérations sont effectuées avec ce paramètre et ne prennent pas en charge undefined.

Exemple :

Dans la fonction greet(), il est vérifié si le paramètre name est passé. Sinon, la chaîne Guest est utilisée.

JavaScript
    
      function greet(name) {
        if (name === undefined) {
          return 'Hello, Guest!';
        }
        return `Hello, ${name}!`;
      }

      console.log(greet()); // "Hello, Guest!"
      console.log(greet('Bob')); // "Hello, Bob!"
    
  

4.2 Paramètres par défaut

Les paramètres par défaut permettent de définir des valeurs qui seront utilisées si un argument n'est pas transmis lors de l'appel de la fonction ou est transmis comme undefined. C'est particulièrement utile pour créer des fonctions avec des paramètres optionnels.

Syntaxe :

    
      function name (arg1 = value1, arg2 = value2) {
        // corps de la fonction
      }
    
  

Exemple 1 : Fonction simple avec paramètres par défaut

Dans cet exemple, la fonction greet() a un paramètre name avec une valeur par défaut de Guest. Si l'argument n'est pas passé, la valeur par défaut sera utilisée.

JavaScript
    
      function greet(name = 'Guest') {
        return `Hello, ${name}!`;
      }

      console.log(greet('Alice')); // Affichera : Hello, Alice!
      console.log(greet());        // Affichera : Hello, Guest!
    
  

Exemple 2 : Paramètres par défaut avec des expressions

Dans cet exemple, le paramètre tax par défaut est calculé comme 20% de price si aucun autre argument n'est passé.

JavaScript
    
      function calculatePrice(price, tax = price * 0.2) {
        return price + tax;
      }

      console.log(calculatePrice(100));  // Affichera : 120
      console.log(calculatePrice(100, 15)); // Affichera : 115
    
  

Exemple 3 : Paramètres par défaut dépendant d'autres paramètres

Dans cet exemple, les paramètres par défaut permettent de créer un utilisateur avec des rôles et statuts prédéfinis.

JavaScript
    
      function createUser(name, role = 'user', isActive = true) {
        return { name, role, isActive };
      }

      console.log(createUser('Alice')); // Affichera : { name: 'Alice', role: 'user', isActive: true }
      console.log(createUser('Bob', 'admin')); // Affichera : { name: 'Bob', role: 'admin', isActive: true }
      console.log(createUser('Charlie', 'moderator', false)); // Affichera : { name: 'Charlie', role: 'moderator', isActive: false }
    
  

4.3 Paramètres rest

Les paramètres rest permettent à une fonction de recevoir un nombre quelconque d'arguments et de les regrouper dans un tableau. C'est utile pour créer des fonctions qui peuvent gérer un nombre arbitraire d'arguments.

Syntaxe :

    
      function name (arg1, arg2, ...argArray) {
        // corps de la fonction
      }
    
  

Exemple 1 : Addition de tous les arguments passés

Dans cet exemple, la fonction sumAll() utilise les paramètres rest pour additionner tous les arguments passés.

JavaScript
    
      function sumAll(...numbers) {
        return numbers.reduce((sum, num) => sum + num, 0);
      }

      console.log(sumAll(1, 2, 3));       // Affichera : 6
      console.log(sumAll(4, 5, 6, 7, 8)); // Affichera : 30
    
  

Exemple 2 : Fonction avec des paramètres fixes et rest

Dans cet exemple, la fonction showItems() prend un paramètre fixe firstItem et un nombre indéfini d'autres arguments regroupés dans le tableau otherItems.

JavaScript
    
      function showItems(firstItem, ...otherItems) {
        console.log(`Premier élément: ${firstItem}`);
        console.log(`Autres éléments: ${otherItems.join(', ')}`);
      }

      showItems('apple', 'banana', 'cherry', 'date');

      // Affichera :
      // Premier élément: apple
      // Autres éléments: banana, cherry, date
    
  

Exemple 3 : Fonction avec des arguments dynamiques

Dans cet exemple, la fonction createMessage() prend le premier argument messageType et regroupe tous les autres paramètres dans le tableau messages pour créer un message.

JavaScript
    
      function createMessage(messageType, ...messages) {
        return `[${messageType.toUpperCase()}]: ${messages.join(' ')}`;
      }

      console.log(createMessage('info', 'This', 'is', 'an', 'informational', 'message'));
      // Affichera : [INFO]: This is an informational message

      console.log(createMessage('error', 'An', 'error', 'occurred'));
      // Affichera : [ERROR]: An error occurred
    
  
Commentaires
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION