JavaScript è un linguaggio utilizzato nella programmazione web lato client. Ciò significa che gli script sono interpretati dal browser web, nel computer di ciascun utente.

Ricordiamo che invece i linguaggi web lato server contengono codice che viene eseguito sul server (dove è ospitato il sito web). Cioè, dopo aver elaborato il codice, viene inviato al browser dell’utente che ne ha fatto richiesta.

Nella scorsa lezione abbiamo parlato di come integrare il codice JavaScript nelle nostre pagine web e quindi quale metodo di inclusione conviene utilizzare piuttosto che un altro. In questa lezione approfondiremo alcuni concetti, tra cui quello di funzione.

function JavaScript

Una function è un blocco di codice dove inserire delle istruzioni ed è eseguita quando è invocata (chiamata).

In genere una funzione viene richiamata in una pagina web tramite un pulsante o al verificarsi di un determinato evento.

Una function in JavaScript ha un nome ed inoltre può avere anche dei parametri racchiusi tra due parentesi tonde.

Le istruzioni da eseguire sono invece indicate tra parentesi graffe.

Facciamo dunque degli esempi per capire meglio il funzionamento:

<script type="text/javascript">
function ora() { 
    var d = new Date();
    var ora = d.toLocaleTimeString();
    alert(ora);
}
</script>

Notiamo innanzitutto che stiamo utilizzando new Date() per creare un oggetto Date.

L’oggetto Date è utilizzato per lavorare con le date e gli orari ed il metodo toLocaleTimeString restituisce l’ora dall’oggetto Date.

All’interno della function ora(), che non ha parametri racchiusi tra parentesi tonde, memorizziamo l’ora in una variabile e richiamiamo il metodo alert. Ricordiamo che il metodo alert() serve a creare una finestra che si apre sul browser. Nel nostro caso specifico mostrerà l’ora.

Dopo inseriamo nella nostra pagina web un richiamo alla funzione creata in JavaScript nel punto desiderato.

Ad esempio si può inserire un pulsante che al click richiama la funzione ora.

<input onclick="ora()" value="Mostra l'ora" type="button">

Potete vedere il risultato facendo clic sul pulsante sotto: ‘mostra l’ora‘. Vi mostrerà l’orario attuale.


Realizziamo lo stesso esempio ma visualizzando il messaggio nella pagina html, piuttosto che in una finestra di dialogo. Utilizziamo il semplice metodo document.write per questo scopo, come nell’esempio sotto:

<script type="text/javascript">
function ora() { 
	var orario=new Date();
	var ora=orario.toLocaleTimeString();
	document.write("Altro modo per visualizzare un messaggio! ");
	document.write("<p>Orario: " + ora + "</p>")
}
</script>
<body onload="ora()">
...
</body>

Provate ad inserire questo codice per visualizzare l’orario nella vostra pagina web per vederne il risultato.

Alcuni link utili

Indice argomenti linguaggio JavaScript

1 – Introduzione al tutorial

2 – Come utilizzare gli alert

3- Come utilizzare JavaScript confirm