Che cosa sono le arrow function in JavaScript

di Lorenzo Neri

Le arrow function sono un’alternativa più compatta di quelle tradizionali e in questo articolo vedremo cosa sono e funzionano in JavaScript.

Quindi, le arrow function dette col meno tecnichese possibile, sono un’alternativa alle funzioni tradizionali ma senza i suoi riferimenti, senza un nome ben specifico e altri differenti elementi che caratterizzano una funzione.

Ciao mi chiamo Lorenzo Neri e sono un informatico: realizzo contenuti per aiutare le persone a padroneggiare l’arte del nuovo millennio, ovvero l’informatica!

La sintassi delle arrow function

Ora che abbiamo iniziato a vedere cosa sono le arrow function e come funzionano in JavaScript, è giusto fare delle differenziazioni.

In base alla versione EcmaScript che stai usando, vanno scritte in modo diverso.

ES5

saluto = function (){
  return "ciao!";
}

ES6

saluto = () => {
  return "ciao!";
}

Come avrai potuto notare, nella versione 6 di EcmaScript viene usata una freccia anzichè la parola chiave “function”.

Ti suona familiare l’associazione tra il nome e la sua scrittura? 😉

C’è di più.

Se la funzione è composta da una sola riga, non ha bisogno delle parentesi graffe.

Per intenderci:

saluto = () => "ciao!";

Come impostare i parametri di una arrow function in JavaScript

Abbiamo visto che cosa sono le arrow function e come funzionano in maniera basilare.

Ma potresti aver bisogno di usare dei parametri.

Ecco come fare, te lo faccio vedere con un esempio:

saluto = (nome) => "ciao "+nome"!";

Ma anche qua c’è di più.

Se la tua arrow function avesse solo un parametro, puoi evitare addirittura di usare le parentesi tonde per i parametri.

Riprendendo l’esempio di prima:

saluto = nome => "ciao ${nome}!";

Come vengono gestite le arrow function in JavaScript

Tramite le funzioni tradizionali, l’utilizzo della parola chiave “this” si fa riferimento all’oggetto che le ha invocate.

Con le arrow function le cose cambiano di molto.

Le arrow function non hanno riferimento a se stesse, quindi non si può usare il parametro “this” per riferirsi a loro stesse.

Ma allora per che cosa usarle?

L’utilizzo principale delle arrow function è quello di “funzione fatta al volo”.

In altre parole, sono funzioni che puoi scrivere nel momento esatto in cui ti servono ma non vanno richiamate in altri pezzi di codice.

Di solito, le funzioni vengono usate per ripetere una porzione di codice più volte nel tuo programma: sono nate per questo!

Le arrow function diciamo che sono una soluzione pigra 😀

Hai bisogno di generare una funzione quando ad esempio utilizzi la filter, la map, oppure una callback?

Ecco che arrivano in tuo aiuto le arrow function: anziché realizzare una funzione a se stante che magari richiami una volta sola, la scrivi quando ti serve e via andare! 😀

Quindi, ecco cosa sono le arrow function e a che cosa servono in JavaScript!

Continua a scoprire di più con questi articoli!

Lascia un commento

Questo sito potrebbe fare uso di cookie e siccome l'UE mi obbliga a fartelo presente, eccoti il classico banner dove puoi decidere come gestirli. Accetta Leggi di più