Creare funzioni in Javascript

Uno degli elementi chiave di un programma, in questo caso di un programma Javascript, sono la funzioni.

Una funzione raccoglie in se tutte le istruzioni per assolvere ad un determinato compito all’interno di un programma. Una funzione, quindi, è una parte (relativamente) autonoma di un programma in quanto assolve ad un compito specifico che può essere ripetuto più volte in diversi punti del programma stesso.

Organizzare un programma in funzioni consente una maggiore pulizia del codice sorgente e, soprattutto, facilita il riutilizzo del codice e, di conseguenza, consente di creare programmi più snelli e semplici di mantenere ed aggiornare.

La sintassi per creare una funzione in Javascript è la seguente:

function nomeFunzione(argomenti) {
  istruzioni;
}

Utilizziamo la parola chiave function, assegniamo un nome alla funzione, in questo caso "nomeFunzione" e, come si può constatare, utilizziamo le parentesi tonde subito dopo per passare alla funzione eventuali argomenti (cioè dei dati che la funzione potrà utilizzare per la sua elaborazione).

Si noti che il passaggio di argomenti è del tutto facoltativo, in mancanza il nome della funzione sarà seguito da delle parentesi vuote (non essendo possibile ometterle).

Il contenuto della funzione, ovvero le istruzioni che compongono il programma, viene racchiuso tra parentesi graffe { e }.

E’ importante non dare alle funzioni nomi che indicano parole chiave utilizzate da Javascript, ad esempio non è possibile utilizzare write() come nome di una funzione: "write", infatti, è un metodo dell’oggetto document e creando una funzione con questo nome (o con altre parole riservate) ci verrà restituito un errore.

E’ tuttavia possibile utilizzare il nome Write() oppure WRITE(), dato che javascript è un linguaggio case-sensitive, ovvero riconosce differenze tra maiuscolo e minuscolo: in questo modo l’interprete non riconoscerà la funzione Write() come nome di un metodo, ma come parola "estranea" alla sintassi Javascript e la considererà valida.

Valgono, inoltre, per i nomi delle funzioni le stesse considerazioni fatte in occasione dei nomi delle variabili.

Parametri nelle funzioni

Un parametro è in genere un valore soggetto a variazioni, ad esempio una stringa di testo o un numero. I parametri vengono "passati" alla funzione all’interno delle parentesi tonde che seguono al nome della funzione. Se sono più di uno, i parametri delle funzione devono essere separati da una virgola.

function nomeFunzione(arg1, arg2, ..., argN) {
  istruzioni;
}

Facciamo un esempio di una semplice funzione per il calcolo dell’IVA su un prezzo.

function calcolaIVA(prezzo,aliquota){
  var iva = (prezzo/100)*aliquota;
  alert(iva + ' Euro');
}

Per richiamare la funzione:

<span onclick="calcolaIVA(100,22)">clicca qui</span>

Facendo click apparirà un alert con il valore dell’IVA applicata al prezzo passato in argomento (nel nostro caso il risultato sarà "22 Euro").

Impostare un valore di ritorno con return

Nel nostro esempio il risultato della funzione viene mostrato all’interno di una finestra di avviso. Molto spesso, in realtà, il frutto dell’elaborazione di una funzione viene restituito attraverso l’utilizzo della keyword return, viene cioè restituito sotto forma di valore di ritorno.

Così facendo la funzione non si interessa del modo in cui il valore verrà eventualmente mostrato a video… ma si limita ad effettuare la sua elaborazione ed a restituirne il risultato alla routine principale.

Vediamo, quindi, l’esempio del nostro calcolatore di IVA modificato:

function calcolaIVA(prezzo,aliquota){
  var iva = (prezzo/100)*aliquota;
  return iva;
}

Per ottenere lo stesso risultato di prima, quindi, avremmo dovuto impostare l’alert() direttamente nell’evento onclick del tag <span> in questo modo:

<span onclick="alert(calcolaIVA(100,22))">clicca qui</span>

L’utilizzo di return è molto utile quando la funzione viene utilizzata in diversi punti del programma ed il suo risultato manipolato in modi differenti. Utilizzando return, inoltre, il risultato di una funzione può essere utilizzato anche per valorizzare una variabile:

var tax = calcolaIVA(100,22);