Définitions de fonctions JavaScript
Les fonctions JavaScript sont définies avec le
mot- functionclé.
Vous pouvez utiliser une déclaration de fonction ou une expression de fonction .
Déclarations de fonction
Plus tôt dans ce didacticiel, vous avez appris que les fonctions sont déclarées avec la syntaxe suivante :
function functionName(parameters) {
// code to be executed
}
Les fonctions déclarées ne sont pas exécutées immédiatement. Ils sont "enregistrés pour une utilisation ultérieure", et seront exécutés plus tard, lorsqu'ils seront invoqués (invoqués).
Exemple
function myFunction(a, b) {
return a * b;
}
Les points-virgules sont utilisés pour séparer les instructions JavaScript exécutables.
Puisqu'une déclaration de fonction n'est pas une instruction exécutable, il n'est pas courant de la terminer par un point-virgule.
Expressions de fonction
Une fonction JavaScript peut également être définie à l'aide d'une expression .
Une expression de fonction peut être stockée dans une variable :
Exemple
const x = function (a, b) {return a * b};
Une fois qu'une expression de fonction a été stockée dans une variable, la variable peut être utilisée comme fonction :
Exemple
const x = function (a, b) {return a * b};
let z = x(4, 3);
La fonction ci-dessus est en fait une fonction anonyme (une fonction sans nom).
Les fonctions stockées dans des variables n'ont pas besoin de noms de fonction. Ils sont toujours invoqués (appelés) en utilisant le nom de la variable.
La fonction ci-dessus se termine par un point-virgule car elle fait partie d'une instruction exécutable.
Le constructeur Function()
Comme vous l'avez vu dans les exemples précédents, les fonctions JavaScript sont définies avec le functionmot clé.
Les fonctions peuvent également être définies avec un constructeur de fonctions JavaScript intégré appelé
Function().
Exemple
const myFunction = new Function("a", "b", "return a * b");
let x = myFunction(4, 3);
En fait, vous n'avez pas besoin d'utiliser le constructeur de fonction. L'exemple ci-dessus revient au même que d'écrire :
Exemple
const myFunction = function (a, b) {return a * b};
let x = myFunction(4, 3);
La plupart du temps, vous pouvez éviter d'utiliser le mot- newclé en JavaScript.
Fonction Levage
Plus tôt dans ce didacticiel, vous avez appris le « levage » ( JavaScript Hoisting ).
Le levage est le comportement par défaut de JavaScript consistant à déplacer les déclarations vers le haut de la portée actuelle.
Le levage s'applique aux déclarations de variables et aux déclarations de fonctions.
De ce fait, les fonctions JavaScript peuvent être appelées avant d'être déclarées :
myFunction(5);
function myFunction(y) {
return y * y;
}
Les fonctions définies à l'aide d'une expression ne sont pas hissées.
Fonctions d'appel automatique
Les expressions de fonction peuvent être rendues "auto-invoquantes".
Une expression auto-invoquante est invoquée (démarrée) automatiquement, sans être appelée.
Les expressions de fonction s'exécuteront automatiquement si l'expression est suivie de ().
Vous ne pouvez pas auto-invoquer une déclaration de fonction.
Vous devez ajouter des parenthèses autour de la fonction pour indiquer qu'il s'agit d'une expression de fonction :
Exemple
(function () {
let x = "Hello!!"; // I will invoke myself
})();
La fonction ci-dessus est en fait une fonction auto-invoquante anonyme (fonction sans nom).
Les fonctions peuvent être utilisées comme valeurs
Les fonctions JavaScript peuvent être utilisées comme valeurs :
Exemple
function myFunction(a, b) {
return a * b;
}
let x = myFunction(4, 3);
Les fonctions JavaScript peuvent être utilisées dans les expressions :
Exemple
function myFunction(a, b) {
return a * b;
}
let x = myFunction(4, 3) * 2;
Les fonctions sont des objets
L' typeofopérateur en JavaScript renvoie "fonction" pour les fonctions.
Mais les fonctions JavaScript peuvent être décrites au mieux comme des objets.
Les fonctions JavaScript ont à la fois des propriétés et des méthodes .
La arguments.lengthpropriété renvoie le nombre d'arguments reçus lorsque la fonction a été invoquée :
Exemple
function myFunction(a, b) {
return arguments.length;
}
La toString()méthode renvoie la fonction sous forme de chaîne :
Exemple
function myFunction(a, b) {
return a * b;
}
let text = myFunction.toString();
Une fonction définie comme la propriété d'un objet est appelée une méthode de l'objet.
Une fonction conçue pour créer de nouveaux objets est appelée constructeur d'objet.
Fonctions fléchées
Les fonctions fléchées permettent une syntaxe courte pour écrire des expressions de fonction.
Vous n'avez pas besoin du mot- functionclé, du mot- returnclé et
des accolades .
Exemple
// ES5
var x = function(x, y) {
return x * y;
}
// ES6
const x = (x, y) => x * y;
Les fonctions fléchées n'ont pas leur propre this. Ils ne sont pas bien adaptés pour définir des méthodes d'objet .
Les fonctions fléchées ne sont pas hissées. Ils doivent être définis avant d' être utilisés.
L'utilisation const
est plus sûre que l'utilisation de var, car une expression de fonction est toujours une valeur constante.
Vous ne pouvez omettre le returnmot-clé et les accolades que si la fonction est une instruction unique. Pour cette raison, ce pourrait être une bonne habitude de toujours les garder :
Exemple
const x = (x, y) => { return x * y };
Les fonctions fléchées ne sont pas prises en charge dans IE11 ou versions antérieures.