Fonction fléchée

Les fonctions fléchées sont une écriture simplifiée des fonctions.

DéfinitionSyntaxe

1
(arguments) => { instructions }

Exemple :

1
const maFonction = (a, b)=>{return a+b;}
2
window.console.log(maFonction(3,2)); // affiche 5

Écriture classique :

1
const maFonction = function(a, b) { return a+b;}
2
window.console.log(maFonction(3,2)); // affiche 5

DéfinitionSimplification

Quand les instructions se résument à un return, on peut simplifier l'écriture en supprimant les accolades et le return :

1
const maFonction = (a, b)=> a+b;
2
window.console.log(maFonction(3,2)); // affiche 5

Quand il n'y a qu'un argument, on peut simplifier l'écriture en supprimant les parenthèses :

1
const maFonction = a => a*a;
2
window.console.log(maFonction(3)); // affiche 9

Fonction sans argument, il faut mettre les parenthèses :

1
const maFonction = () => false;
2
window.console.log(maFonction()); // affiche false

AttentionPas complètement équivalent

Les fonctions fléchées ne sont pas totalement identiques aux fonctions classiques.

Elles ne changent pas les valeurs this, arguments et super (voir programmation Objet). Ces valeurs correspondent à celles de l'objet englobant (scope parent).

Exemple :

See the Pen cours-js-fonction-flechee by BCMM-W2D (@bcmm-w2d) on CodePen.

Function flechée