Les fonctions

9 janvier, 2023

Développement Javascript Tutoriels

Table des matières Masquer

1 Déclaration de fonctions

2 Les arguments et les paramètres

3 Le type de retour des fonctions

4 Les fonctions fléchées

5 Conclusion

Dans le chapitre précédent, nous avons vu comment utiliser les boucles et les instructions de contrôle de flux pour contrôler l’exécution de notre code. Dans cette partie du tutoriel, nous allons explorer un autre élément important de JavaScript : les fonctions.

Les fonctions sont des blocs de code qui peuvent être exécutés à volonté, ce qui vous permet de définir une tâche unique et de l’exécuter plusieurs fois sans avoir à réécrire le code. Cela peut vous aider à écrire du code plus efficace et plus facile à maintenir, car vous pouvez définir une tâche une fois et l’utiliser plusieurs fois dans votre code.

Voici les différents éléments à prendre en compte lors de l’écriture de fonctions en JavaScript :

La déclaration de fonctions
Les arguments et les paramètres
Le type de retour des fonctions
Les fonctions fléchées

Déclaration de fonctions

Il existe deux manières de déclarer une fonction en JavaScript : la déclaration de fonction et l’expression de fonction.

Déclaration de fonction

function maFonction() {
  // code à exécuter
}

Expression de fonction

const maFonction = function() {
  // code à exécuter
}

Les arguments et les paramètres

Les arguments sont les valeurs passées à une fonction lors de son appel. Les paramètres sont les variables définies dans la déclaration de la fonction qui correspondent aux arguments passés à la fonction.

Voici un exemple de fonction avec un argument et un paramètre :

function maFonction(parametre) {
  console.log(parametre);
}

maFonction('Bonjour'); // affiche 'Bonjour' dans la console

Le type de retour des fonctions

Les fonctions peuvent retourner une valeur à l’aide de l’instruction « return ». Si une fonction ne retourne aucune valeur, elle est considérée comme retournant « undefined ».

function maFonction() {
  return 'Bonjour';
}

console.log(maFonction()); // affiche 'Bonjour' dans la console

Vous pouvez également retourner plusieurs valeurs dans une fonction en utilisant un objet ou un tableau :

function maFonction() {
  return {
    message: 'Bonjour',
    nombre: 42
  };
}

console.log(maFonction()); 
// affiche { message: 'Bonjour', nombre: 42 } dans la console

function maFonction() {
  return [1, 2, 3];
}

console.log(maFonction()); // affiche [1, 2, 3] dans la console

ILorsque vous utilisez l’instruction « return », la fonction s’arrête immédiatement et le code qui suit la fonction n’est pas exécuté. Voici un exemple de code qui illustre cela :

function maFonction() {
  return 'Bonjour';
  console.log('Ce message ne sera jamais affiché');
}

console.log(maFonction()); // affiche 'Bonjour' dans la console

Les fonctions fléchées

Les fonctions fléchées (ou fonctions « arrow functions » en anglais) sont une syntaxe plus concise pour écrire des fonctions en JavaScript. Elles sont particulièrement utiles lorsque vous avez besoin d’écrire une fonction simple qui ne nécessite pas de corps complet.

const maFonction = () => {
  // code à exécuter
};

Si vous avez une fonction qui ne prend pas d’arguments et qui ne retourne aucune valeur, vous pouvez encore simplifier la syntaxe de la fonction fléchée en supprimant les parenthèses et le corps de la fonction :

const maFonction = () => console.log('Bonjour');

this Les fonctions fléchées n'ont pas leur propre "this", ce qui signifie que vous ne pouvez pas utiliser "this" à l'intérieur d'une fonction fléchée de la même manière que vous le feriez dans une fonction normale.

Conclusion

Les fonctions sont un élément clé de JavaScript et sont essentielles pour écrire du code efficace et facile à maintenir. En maîtrisant l’utilisation de la déclaration de fonctions, des arguments et des paramètres, du type de retour et des fonctions fléchées, vous serez en mesure de créer des fonctions puissantes et utiles dans vos applications.

Dans le prochain chapitre, nous allons explorer un autre concept important en JavaScript : les objets. Nous verrons comment créer et utiliser des objets pour stocker et manipuler des données de manière structurée dans notre code.