Une fonction est un bloc de code organisé et réutilisable qui sert à effectuer une action. Il existe plusieurs façons de définir des fonctions en JavaScript. On va voir ici les déclarations de fonction et les expressions de fonction. D'autres possibilités, comme les fonctions fléchées, seront abordées dans d'autres concepts.
La façon standard de définir une fonction en JavaScript est la déclaration de fonction, aussi appelée définition de fonction ou instruction de fonction.
Elle se compose du mot-clé function, du nom de la fonction et d'une liste de paramètres séparés par des virgules, entre parenthèses.
Vient ensuite le corps de la fonction (l'ensemble des instructions qui définissent ce que fait la fonction), entre accolades.
function someName(param1, param2, param3) {
// ...
}
En JavaScript, on invoque (appelle) une fonction en écrivant le nom de la fonction suivi de parenthèses contenant les arguments.
someName(arg1, arg2, arg3);
Quand tu manipules des paramètres dans le corps de la fonction, fais attention aux éventuels effets de bord.
Par défaut, en JavaScript, tous les paramètres définis dans la déclaration de fonction sont facultatifs.
Si tu fournis moins d'arguments qu'il n'y a de paramètres, les arguments manquants vaudront undefined à l'intérieur de la fonction, voir Null et Undefined.
Dans de nombreux cas, il est judicieux d'attribuer une valeur par défaut plus appropriée que undefined.
Pour cela, tu peux spécifier des paramètres par défaut directement dans la définition de la fonction.
function someName(param1 = defaultValue1, param2 = defaultValue2) {
// ...
}
return
Une instruction return met fin à l'exécution de la fonction et spécifie une valeur à renvoyer à l'appelant de la fonction. Une fonction peut contenir plusieurs instructions return.
function checkNumber(num) {
if (num === 0) {
return 'You passed 0, please provide another number.';
}
return 'Thanks for passing such a nice number.';
}
La valeur de retour d'une fonction peut être stockée dans une variable.
function sum(x, y) {
return x + y;
}
const total = sum(5, 10);
// => 15
Une fonction qui ne renvoie aucune valeur avec return, ou qui ne possède pas d'instruction return, a pour résultat undefined.
Il n'y a pas de return implicite en JavaScript.
function nakedReturn(a) {
a * 2;
return;
}
nakedReturn(1);
// => undefined
function noReturn(a) {
a * 2;
}
noReturn(1);
// => undefined
En JavaScript, tu ne peux renvoyer qu'une seule valeur. Si tu veux transmettre plus d'informations, tu dois d'abord les regrouper dans une seule entité, généralement un objet ou un tableau.
function divide(a, b) {
return {
quotient: Math.floor(a / b),
remainder: a % b,
};
}
Une déclaration de fonction est une instruction autonome. Mais il est parfois utile de définir une fonction au sein d'une autre expression, par exemple dans une affectation, comme paramètre de fonction (fonction de rappel) ou comme valeur dans un objet. C'est ce que permet une expression de fonction. Elle a la même syntaxe qu'une déclaration de fonction, à ceci près que le nom de la fonction peut être omis pour créer une fonction anonyme.
const someFunction = function (param) {
// ...
};
someOtherFunction(function (param) {
// ...
});
const obj = {
someFunction: function (param) {
// ...
},
};
Dans cet exercice, tu vas écrire un peu plus de code pour préparer et cuisiner ta superbe lasagne, tirée de ton livre de recettes préféré.
Tu as cinq tâches. La première concerne la cuisson elle-même, les quatre autres portent sur une préparation parfaite.
Quand on a une lasagne au four, on veut savoir si on peut déjà la sortir ou non. Pour éviter que la lasagne ne brûle au four, on règle généralement un minuteur. Mais il arrive qu'on oublie de le faire.
Écris une fonction cookingStatus qui prend en paramètre le temps restant sur le minuteur, en minutes.
La fonction peut renvoyer trois résultats possibles.
0, elle doit renvoyer 'Lasagna is done.'.'Not done, please wait.'.'You forgot to set the timer.'.Le minuteur n'affichera jamais de valeur inférieure à 0.
cookingStatus(12);
// => 'Not done, please wait.'
cookingStatus();
// => 'You forgot to set the timer.'
Pour la prochaine lasagne que tu prépareras, tu veux t'assurer d'avoir réservé assez de temps pour profiter de la cuisson. Tu as déjà établi un plan avec toutes les couches que ta lasagne contiendra. Tu veux maintenant estimer la durée de la préparation à partir de ce plan.
Implémente une fonction preparationTime qui prend un tableau de couches et le temps de préparation moyen par couche, en minutes.
La fonction doit renvoyer une estimation du temps de préparation total, en fonction du nombre de couches.
Si la fonction est appelée sans qu'on lui fournisse le temps de préparation moyen, on considère par défaut 2 minutes.
const layers = ['sauce', 'noodles', 'sauce', 'meat', 'mozzarella', 'noodles'];
preparationTime(layers, 3);
// => 18
preparationTime(layers);
// => 12
En plus de réserver le temps nécessaire, tu veux t'assurer d'avoir assez de sauce et de nouilles pour cuisiner la lasagne de tes rêves. Pour chaque couche de nouilles de ta lasagne, il te faudra 50 grammes de nouilles. Pour chaque couche de sauce de ta lasagne, il te faudra 0,2 litre de sauce.
Définis la fonction quantities qui prend un tableau de couches en paramètre.
La fonction détermine ensuite la quantité de nouilles et de sauce nécessaire pour préparer ton plat.
Le résultat doit être renvoyé sous forme d'objet avec les clés noodles et sauce.
quantities(['sauce', 'noodles', 'sauce', 'meat', 'mozzarella', 'noodles']);
// => { noodles: 100, sauce: 0.4 }
Il y a quelque temps, tu as rendu visite à un ami et tu as mangé une lasagne chez lui. Elle était délicieuse et avait quelque chose de spécial. Cet ami t'a envoyé la liste des ingrédients et t'a dit que le dernier élément de la liste était l'« ingrédient secret » qui rendait ce plat si spécial. Tu veux maintenant ajouter toi aussi cet ingrédient secret à ta recette.
Écris une fonction addSecretIngredient qui prend deux tableaux d'ingrédients en paramètres.
Le premier paramètre est la liste que ton ami t'a envoyée, et le second la liste d'ingrédients de ta propre recette.
La fonction doit ajouter le dernier élément de la liste de ton ami à la fin de ta liste.
Le tableau qui représente ta recette doit être modifié directement, et la fonction ne doit rien renvoyer.
En revanche, le premier argument ne doit pas être modifié.
const friendsList = ['noodles', 'sauce', 'mozzarella', 'kampot pepper'];
const myList = ['noodles', 'meat', 'sauce', 'mozzarella'];
addSecretIngredient(friendsList, myList);
// => undefined
console.log(myList);
// => ['noodles', 'meat', 'sauce', 'mozzarella', 'kampot pepper']
Les quantités indiquées dans ton livre de recettes ne donnent assez de lasagne que pour deux portions. Comme tu veux cuisiner pour plus de personnes la prochaine fois, tu veux calculer les quantités pour un nombre de portions différent.
Implémente une fonction scaleRecipe qui prend deux paramètres.
La fonction doit renvoyer un objet recette contenant les quantités nécessaires pour le nombre de portions souhaité. Tu veux cependant conserver la recette d'origine. Cela signifie que, dans cette tâche, l'argument recette ne doit pas être modifié.
const recipe = {
noodles: 200,
sauce: 0.5,
mozzarella: 1,
meat: 100,
};
scaleRecipe(recipe, 4);
// =>
// {
// noodles: 400,
// sauce: 1,
// mozzarella: 2,
// meat: 200,
// };
console.log(recipe);
// =>
// {
// noodles: 200,
// sauce: 0.5,
// mozzarella: 1,
// meat: 100,
// };
Inscris-toi sur Exercism pour apprendre et maîtriser JavaScript avec 37 concepts159 exercices, et un vrai mentorat humain, le tout gratuitement.