Fonctions JavaScript
Une fonction JavaScript est un bloc de code conçu pour effectuer une tâche particulière.
Une fonction JavaScript est exécutée lorsque "quelque chose" l'invoque (l'appelle).
Exemple
function myFunction(p1, p2) {
return p1 * p2;
// The function returns the product of p1 and p2
}
Syntaxe de la fonction JavaScript
Une fonction JavaScript est définie avec le mot- function
clé, suivi d'un nom , suivi de parenthèses () .
Les noms de fonction peuvent contenir des lettres, des chiffres, des traits de soulignement et des signes dollar (mêmes règles que les variables).
Les parenthèses peuvent inclure des noms de paramètres séparés par des virgules :
( paramètre1, paramètre2, ... )
Le code à exécuter, par la fonction, est placé entre accolades : {}
function
name(parameter1, parameter2, parameter3) {
// code to be executed
}
Les paramètres de la fonction sont répertoriés entre parenthèses () dans la définition de la fonction.
Les arguments de la fonction sont les valeurs reçues par la fonction lorsqu'elle est invoquée.
A l'intérieur de la fonction, les arguments (les paramètres) se comportent comme des variables locales.
Une fonction est sensiblement la même qu'une procédure ou un sous-programme, dans d'autres langages de programmation.
Appel de fonction
Le code à l'intérieur de la fonction s'exécutera lorsque "quelque chose" invoque (appelle) la fonction :
- Lorsqu'un événement se produit (lorsqu'un utilisateur clique sur un bouton)
- Lorsqu'il est invoqué (appelé) à partir du code JavaScript
- Automatiquement (auto-invoqué)
Vous en apprendrez beaucoup plus sur l'invocation de fonction plus loin dans ce didacticiel.
Retour de fonction
Lorsque JavaScript atteint une return
instruction, la fonction s'arrête.
Si la fonction a été appelée à partir d'une instruction, JavaScript "reviendra" pour exécuter le code après l'instruction d'appel.
Les fonctions calculent souvent une valeur de retour . La valeur de retour est "renvoyée" à "l'appelant":
Exemple
Calculez le produit de deux nombres et retournez le résultat :
let x = myFunction(4, 3); // Function is called, return value will end up in x
function myFunction(a, b) {
return a * b;
// Function returns the product of a and b
}
Le résultat en x sera :
12
Pourquoi Fonctions ?
Vous pouvez réutiliser le code : définissez le code une fois et réutilisez-le plusieurs fois.
Vous pouvez utiliser le même code plusieurs fois avec des arguments différents, pour produire des résultats différents.
Exemple
Convertir Fahrenheit en Celsius :
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);
L'opérateur () appelle la fonction
En utilisant l'exemple ci-dessus, toCelsius
fait référence à l'objet fonction et
toCelsius()
fait référence au résultat de la fonction.
L'accès à une fonction sans () renverra l'objet de la fonction au lieu du résultat de la fonction.
Exemple
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
document.getElementById("demo").innerHTML = toCelsius;
Fonctions utilisées comme valeurs variables
Les fonctions peuvent être utilisées de la même manière que vous utilisez des variables, dans tous les types de formules, d'affectations et de calculs.
Exemple
Au lieu d'utiliser une variable pour stocker la valeur de retour d'une fonction :
let x = toCelsius(77);
let text = "The temperature is " + x + " Celsius";
Vous pouvez utiliser la fonction directement, comme valeur de variable :
let text = "The temperature is " + toCelsius(77) + " Celsius";
Vous en apprendrez beaucoup plus sur les fonctions plus tard dans ce tutoriel.
Variables locales
Les variables déclarées dans une fonction JavaScript deviennent LOCALES à la fonction.
Les variables locales ne sont accessibles qu'à partir de la fonction.
Exemple
// code here can NOT use carName
function myFunction() {
let carName = "Volvo";
// code here CAN use carName
}
// code here can NOT use carName
Étant donné que les variables locales ne sont reconnues qu'à l'intérieur de leurs fonctions, les variables portant le même nom peuvent être utilisées dans différentes fonctions.
Les variables locales sont créées lorsqu'une fonction démarre et supprimées lorsque la fonction est terminée.