Fonctions

Qu'est-ce qu'une fonction ?

Imagine une machine à café. Tu appuies sur un bouton, tu obtiens du café. Tu n'as pas besoin de comprendre les mécanismes internes.

Une fonction, c'est pareil : un bloc de code avec un nom. Tu l'appelles autant de fois que tu veux, sans réécrire le code.

Les fonctions servent à :

• Éviter les répétitions
• Organiser le code en petits blocs logiques
• Rendre le code réutilisable et facile à modifier

Créer et appeler une fonction

// 1. Définir la fonction (on décrit ce qu'elle fait)
function direBonjour() {
  console.log("Bonjour tout le monde !");
}

// 2. Appeler la fonction (on l'utilise)
direBonjour(); // Bonjour tout le monde !
direBonjour(); // Bonjour tout le monde !
direBonjour(); // Bonjour tout le monde !

On définit la fonction une seule fois. On l'appelle autant de fois qu'on veut.

Les paramètres — personnaliser la fonction

Une fonction peut recevoir des paramètres : des infos qu'on lui passe pour adapter son comportement. Comme les ingrédients de la machine à café.

// La fonction accepte un paramètre : "prenom"
function saluer(prenom) {
  console.log(`Bonjour, ${prenom} !`);
}

saluer("Alice");  // Bonjour, Alice !
saluer("Thomas"); // Bonjour, Thomas !
saluer("Marie");  // Bonjour, Marie !

Plusieurs paramètres possibles, séparés par des virgules :

function addition(a, b) {
  console.log(a + b);
}

addition(3, 5);   // 8
addition(10, 20); // 30

return — récupérer un résultat

Jusqu'ici, les fonctions affichaient des messages. Souvent, on veut qu'une fonction calcule et renvoie un résultat. C'est le rôle de return.

function calculerTTC(prixHT, tauxTVA) {
  return prixHT * (1 + tauxTVA);
}

// On récupère le résultat dans une variable
const prixFinal = calculerTTC(100, 0.20);
console.log(prixFinal); // 120

// Ou directement dans un template literal
console.log(`Prix TTC : ${calculerTTC(50, 0.20)} €`); // Prix TTC : 60 €

Les fonctions fléchées — syntaxe moderne

JavaScript propose une façon plus courte d'écrire des fonctions : la fonction fléchée (arrow function). On la voit partout dans le code moderne. La flèche c'est =>.

// Syntaxe classique
function doubler(n) {
  return n * 2;
}

// Même chose avec une flèche =>  (arrow function)
const doubler = (n) => {
  return n * 2;
};

// Version encore plus courte (si une seule expression)
const doubler = (n) => n * 2;

console.log(doubler(5)); // 10

Les trois versions font exactement la même chose. Commence par la syntaxe classique. Les fonctions fléchées viendront avec la pratique.

Valeurs par défaut

On peut donner une valeur par défaut à un paramètre. Si rien n'est fourni lors de l'appel, la valeur par défaut est utilisée.

function saluer(prenom, civilite = "M.") {
  console.log(`Bonjour ${civilite} ${prenom} !`);
}

saluer("Dupont", "Mme"); // Bonjour Mme Dupont !
saluer("Martin");       // Bonjour M. Martin ! (valeur par défaut)

Essaie dans le playground