Partie 5 — Les fonctions en JavaScript : une logique réutilisable comme un humain

Jusqu’à présent, nous avons appris à stocker des données (variables) et à prendre des décisions (conditions). Mais si vous écrivez tout votre code ligne par ligne, sans structure, vous allez très vite vous perdre.

C’est exactement pour cela que les fonctions existent. Elles permettent de regrouper une logique, de lui donner un nom, et de la réutiliser autant de fois que nécessaire.

Dans cette partie, vous allez franchir un cap important : vous allez commencer à penser comme un développeur, et non plus comme quelqu’un qui écrit simplement des instructions.

1) Qu’est-ce qu’une fonction ? (métaphore simple et humaine)

Imaginez une fonction comme une machine. Cette machine :

• peut recevoir des informations en entrée
• fait un traitement
• peut donner un résultat en sortie

Exemple dans la vie réelle :

• Entrée : des ingrédients
• Traitement : cuisson
• Sortie : un plat

En JavaScript, une fonction fonctionne exactement de la même façon. Elle prend des paramètres, exécute du code, et peut retourner une valeur.

Sans fonctions, vous seriez obligé de répéter le même code partout. Avec des fonctions, vous écrivez une logique une seule fois, puis vous l’utilisez quand vous voulez.

2) Pourquoi les fonctions sont indispensables

Les débutants se demandent souvent : “Pourquoi je ne mets pas tout directement dans mon script ?”.

Voici les vraies raisons d’utiliser des fonctions :

• Éviter la répétition (DRY : Don’t Repeat Yourself)
• Améliorer la lisibilité du code
• Faciliter la maintenance
• Réutiliser la logique dans plusieurs endroits
• Découper un problème complexe en petits morceaux

Un bon développeur écrit rarement du code “long”. Il écrit du code clair, découpé en fonctions bien nommées.

3) Déclarer une fonction (fonction classique)

La forme la plus simple d’une fonction est la fonction déclarée.

function direBonjour() {
  console.log("Bonjour !");
}
  

Ici, nous avons :

• function : le mot-clé
• direBonjour : le nom de la fonction
• () : les paramètres (vides pour l’instant)
• {} : le bloc de code

Pour utiliser la fonction, on l’appelle :

direBonjour();
  

Tant que vous n’appelez pas la fonction, son code ne s’exécute pas. C’est une erreur fréquente chez les débutants.

4) Les paramètres : rendre une fonction flexible

Une fonction sans paramètres est limitée. Les paramètres permettent de rendre une fonction adaptable.

function direBonjour(nom) {
  console.log("Bonjour " + nom);
}
  

Appel de la fonction :

direBonjour("Yassine");
direBonjour("Sara");
  

La logique reste la même, seule la donnée change. C’est exactement ce qu’on cherche.

5) return : faire sortir une valeur d’une fonction

Jusqu’ici, nos fonctions affichent des résultats. Mais souvent, on veut récupérer une valeur.

function addition(a, b) {
  return a + b;
}
  

Utilisation :

let resultat = addition(10, 5);
console.log(resultat);
  

Important : dès que JavaScript rencontre return, la fonction s’arrête.

6) Arrow functions : une syntaxe moderne

Les fonctions fléchées (arrow functions) sont une syntaxe plus moderne et plus concise.

const addition = (a, b) => {
  return a + b;
};
  

Version courte :

const addition = (a, b) => a + b;
  

👉 Les arrow functions sont très utilisées dans le JavaScript moderne, mais le principe reste exactement le même.

7) Quand utiliser une fonction ?

Posez-vous cette question simple :

“Est-ce que ce code pourrait être réutilisé ou mérite un nom ?”

Si la réponse est oui → fonction.

• Calculs (prix, taxes, moyennes)
• Validation (email, mot de passe)
• Affichage conditionnel
• Traitement de données

8) Exemples concrets de la vie réelle

Exemple 1 — Calcul du prix TTC

function calculerPrixTTC(prixHT) {
  const TVA = 0.2;
  return prixHT + (prixHT * TVA);
}
  

Exemple 2 — Vérification de mot de passe

function motDePasseValide(password) {
  return password.length >= 8;
}
  

Exemple 3 — Autorisation utilisateur

function peutAcceder(isLoggedIn, isAdmin) {
  return isLoggedIn && isAdmin;
}
  

9) Erreurs fréquentes chez les débutants

• Oublier d’appeler la fonction
• Confondre console.log et return
• Créer des fonctions trop longues
• Donner des noms vagues aux fonctions

👉 Une fonction doit faire une seule chose et la faire bien.

Les fonctions sont un pilier fondamental de JavaScript. Une fois que vous les maîtrisez, vous êtes capable d’écrire du code structuré, propre et réutilisable.

Dans la Partie 6, nous verrons les tableaux (arrays) et les objets, qui permettent de manipuler des groupes de données et de créer des structures beaucoup plus proches du monde réel.