L’instruction return
La leçon précédente envoyait des valeurs dans une fonction. Les vrais programmes ont souvent aussi besoin d’une valeur en sortie — un total, une étiquette, oui/non — pour que l’appelant continue avec le résultat. Le mot-clé qui renvoie ce résultat est return.
Ce que fait return
Dans le corps vous écrivez return expression;. JavaScript évalue l’expression, remet la valeur à l’appelant et termine cet appel. L’appelant peut stocker : let total = add(3, 4); — ici total devient 7.
return n’est pas la même chose que logger
📊 return face à console.log
| Idée | Ce que ça fait | Qui le voit |
|---|---|---|
return value |
envoie value à l’appelant |
votre prochaine ligne de code |
console.log(value) |
affiche value dans la console |
qui regarde la console |
| les deux | vous pouvez logger et aussi renvoyer | le log est pour les yeux ; return pour le programme |
sans return |
l’appel finit avec undefined |
stocker l’appel donne undefined |
après return |
les lignes suivantes de cet appel sont sautées | la sortie anticipée est voulue |
Logger aide à regarder. Renvoyer permet au reste du programme d’utiliser la réponse. Les débutants loggent souvent seulement à l’intérieur et s’étonnent que let x = f() soit undefined — parce que rien n’a été renvoyé.
function add(a, b) {
return a + b;
}
let total = add(3, 4);
console.log(total);
Capturez le résultat
add n’affiche pas toute seule. Elle renvoie 7. L’appelant le met dans total, puis logge. Changez les arguments, gardez le corps — la somme renvoyée suit les entrées.
function greet(name) {
return "Hello, " + name;
}
let line = greet("Sara");
console.log(line);
Construisez une valeur pour plus tard
greet construit une chaîne et la rend. line contient Hello, Sara. Vous pouvez passer line à la page, à une autre fonction ou à un test — return ouvre la réutilisation hors du corps.
function demo() {
console.log("first");
return 1;
console.log("second");
}
demo();
Rien après return ne s’exécute
Cet appel affiche first, puis renvoie 1. La ligne qui afficherait second ne tourne jamais. Ce n’est pas un bug — return termine l’appel tout de suite.
function label(score) {
if (score < 0) {
return "invalid";
}
return "ok";
}
console.log(label(-1));
console.log(label(10));
Partez tôt quand la réponse est prête
Si score est négatif, la fonction renvoie "invalid" et saute le reste. Sinon "ok". Ce retour anticipé garde le chemin heureux court et lisible.
function shout(msg) {
console.log(msg);
}
let result = shout("hi");
console.log(result);
Vous avez oublié return ?
shout ne fait que logger. L’appel se termine quand même — avec undefined. Le stocker met undefined dans result. S’il vous faut une valeur dehors, écrivez un return explicite.
Mettez la valeur renvoyée sur la page
Construisez le message avec return, puis écrivez cette chaîne dans un paragraphe. La fonction produit le texte ; le code de la page décide où il apparaît.
Affichez return sur la page
Déclarez une fonction qui renvoie une chaîne de bienvenue, appelez-la, et placez le résultat dans un paragraphe.
<!DOCTYPE html>
<html>
<head>
<title>return — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
function welcome(guest) {
return "Hello, " + guest;
}
let box = document.getElementById("msg");
box.textContent = welcome("Omar");
</script>
</body>
</html>
La page affiche Hello, Omar. welcome a renvoyé la chaîne ; la ligne suivante l’a écrite dans le paragraphe. Changez seulement l’argument, actualisez, lisez la nouvelle ligne. Prochaine leçon : fonctions fléchées — une écriture plus courte pour certaines de ces fonctions.
À vous d’essayer
- Écrivez
function sum(x, y)qui renvoiex + y, stockez l’appel et loggez la variable. - Écrivez
function hi(name)qui renvoie"hi "plusname, puis loggez la chaîne renvoyée. - Placez un
console.logaprès unreturndans une fonction ; confirmez que la ligne n’affiche rien. - Écrivez une garde : si
n === 0renvoyer"zero", sinon"nonzero". - Appelez une fonction qui ne fait que
console.loget stockez l’appel ; confirmezundefined. - Dans la démo HTML, changez seulement la chaîne d’argument, actualisez et lisez le paragraphe.
Erreurs fréquentes
- N’utiliser que
console.logdans la fonction et s’attendre à ce quelet x = f()tienne une valeur utile - Oublier de stocker ou d’utiliser la valeur renvoyée à l’appel
- Écrire du code après
returnet se demander pourquoi il ne tourne pas - Écrire
return;vide alors que vous vouliezreturn value; - Chercher des astuces de paramètres ici — cette page parle des sorties ; les entrées étaient la leçon précédente
Résumé
returnenvoie une valeur à l’appelant- Stockez ou utilisez cette valeur hors de la fonction
- Après
return, le reste de cet appel est sauté - Le retour anticipé est une sortie propre pour les cas spéciaux
- Sans
return(oureturnvide) → l’appel donneundefined - Les mises à jour de page peuvent utiliser une chaîne renvoyée
- Ensuite : fonctions fléchées — syntaxe compacte de fonction
🧠 Testez Vos Connaissances
Testez Vos Connaissances
Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet
📝 Instructions
- Lisez chaque question attentivement
- Sélectionnez la meilleure réponse pour chaque question
- Vous pouvez refaire le quiz autant de fois que vous le souhaitez
- Votre progression sera affichée en haut