Les fonctions

Les fonctions sont une partie importante dans un langage de programmation et JavaScript n'y échappe pas. Très pratique quand il s'agit d'exécuter un morceau de code sans avoir à écrire ou réécrire ce même code au complet et seulement à l'appel de celui-ci par son nom.

Écrire une fonction

Déjà, trouvez-lui un joli nom. Un nom explicite bien sûr, qui nous indique ce qu'elle fait et ce nom doit être unique pour éviter tous doublons et tous problèmes futurs. Par convention, le nom s'écrira en "camelCase".

JavaScript est sensible à la casse, donc le mot "mafonction" est différent de "maFonction".

Il existe trois manières d'écrire une fonction :

function nomDeMaFonction() {
  // ...
}

// OU

let nomDeMaFonction = function() {
  // ...
}

// OU

let nomDeMaFonction = () => {
  // ...
}

Attention à bien refermer l'accolade ! Le code de la fonction se trouvera entre celles-ci, donc si vous ne clôturer pas convenablement celle-ci, vous aurez le droit à des erreurs.

Le code contenu dans la fonction ne s'exécutera qu'à l'appel de celle-ci.

Appeler une fonction

Une fonction s'appelle tout simplement par son nom.

nomDeMaFonction();

Votre code sera lu du haut vers le bas, en conséquence il est important que votre fonction soit définie avant l'appel.

Passer une valeur

Une fonction peut avoir besoin d'une valeur pour s'exécuter. Ça peut être une chaîne de caractère, un nombre...

Pour transmettre une valeur à la fonction, il suffit de déclarer une variable entre la parenthèse de celle-ci.
Cette variable se nomme : argument.

function nomDeMaFonction(argument) {
  console.log(argument);
}

Dorénavant, ma fonction est capable de recevoir une valeur. Pour lui passer la valeur, nous procéderons ainsi :

nomDeMaFonction("Je suis la valeur de l'argument");

Ma fonction affichera dans la console : Je suis la valeur de l'argument.

Passer plusieurs valeurs

Il est tout à fait possible de passer plusieurs arguments à notre fonction.

Le principe reste exactement le même.
Séparé les différents arguments par une virgule. Nommez-les comme vous le désirez.

function nomDeMaFonction(argument1, argument2, argument3) {
  console.log(argument1, argument2, argument3);
}

Le passage de valeurs s'effectuera de la même manière, mais cette fois-ci, nous en avons plusieurs et elles sont toutes obligatoires :

nomDeMaFonction("Je suis la valeur de l'argument 1", "Je suis la valeur de l'argument 2", "Je suis la valeur de l'argument 3");

Valeurs optionnelles

Il est possible d'avoir des arguments optionnels dans votre fonction. Pour cela, nous attribueront une valeur par défaut.

function nomDeMaFonction(argument1, argument2, argument3 = "Valeur par défaut") {
  console.log(argument1, argument2, argument3);
}

L'argument en troisième position est maintenant facultatif. Si nous ne transmettons pas de valeur à cet argument, il prendra celle définie par défaut : "Valeur par défaut".

Placez toujours votre argument optionnel en dernière position et ceux qui sont obligatoires en première position.

Retourner une valeur

Pour retourner une valeur depuis votre fonction, nous utiliserons le mot clé return.
Nous l'utiliserons seulement quand nous devons sortir une valeur de la fonction, pas avant. Quand l'interpréteur tombe sur ce mot clé, il retourne la valeur et arrête immédiatement la fonction, donc le code situé en dessous ne sera, évidemment, pas exécuté. Placez ce mot clé en dernière position de votre fonction. Vous pouvez en mettre plusieurs, mais je rappelle que si le programme tombe dessus, il retourne la valeur et arrête la fonction.

function calculParCinq(nombre) {
  return 5 * nombre;
}

Ma fonction effectue un calcul et me retourne le résultat. Voyons comment récupérer le résultat :

let resultat = calculParCinq(5);
console.log(resultat); // Résultat : 25

La récupération se fait tout simplement dans une variable.

Variable locale et globale

Avec les fonctions, les variables locales et globales prend toute son importance.

Une variable déclarée dans une fonction par le mot clé var aura une portée limitée à cette seule fonction. On ne pourra alors pas l'exploiter ailleurs dans le script. On l'appelle ainsi variable locale.

function calculParCinq(nombre) {
  var total = 5 * nombre;
}

calculParCinq(5); 
console.log(total); // Résultat  : Erreur !

La variable total dans la fonction calculParCinq() est locale. Je ne peux pas l'utiliser en dehors de la fonction, ni même intervenir dessus.

Par contre, si vous déclarez la variable sans le mot clé var, celle-ci devient automatiquement globale, mais seulement quand la fonction sera exécutée, pas avant :

function calculParCinq(nombre) {
  total = 5 * nombre;
}

console.log(total); // Résultat : Erreur car appelé avant l'appel de la fonction

calculParCinq(5); 
console.log(total); // Résultat : 25

Les variables déclarées en début de script, en dehors et avant les fonctions seront considérées comme globale.

var total = 0;

function calculParCinq(nombre) {
  total = 5 * nombre;
}

console.log(total); // Résultat : 0

calculParCinq(5); 
console.log(total); // Résultat : 25

Récursivité

Une fonction qui s'appelle elle-même devient, dans ce de figure, une fonction récursive. C'est un concept qui n'est pas nouveau en programmation, mais qui demande un peu d'entraînement pour bien l'utiliser. Pour illustrer mon propos, j'utilise une fonction additionnant un nombre et l'arrêter à un certain résultat.

function addition(nombre) {
    if (nombre != 12) {
        nombre += 1;
        console.log(nombre);
        addition(nombre);
    }

    return false;
}

addition(1);