Nella prima parte abbiamo introdotto brevemente gli oggetti e gli
eventi. Vediamo come devono essere organizzate le istruzioni all’interno
del codice HTML:
I tre elementi distintivi: Il corpo principale, Il gestore degli
eventi, le funzioni
Così come in HTML anche Javascript, in grandi linee, ha la sua struttura
che può essere organicamente suddivisa in tre elementi distinti:
Il corpo principale, Il gestore degli eventi, le funzioni.
Cominciamo da quest'ultimo elemento.
Le funzioni
Le funzioni sono delle parti di codice che possono essere invocate
o richiamate in qualsiasi momento si verifichi un evento proveniente
sia dal corpo principale che eventualmente anche da un'altra funzione.
E' corretto inserire le funzioni all'interno dell'intestazione del
codice HTML, e quindi comprese tra <HEAD> e </HEAD>,
in modo tale da permettere al browser di caricare subito in memoria
queste parti di codice, con la finalità di averle immediatamente
a disposizione.
Il corpo principale
Il corpo principale contiene le istruzioni Javascript comprese
tra <SCRIPT LANGUAGE=”Javascript”> e </SCRIPT>
inserite subito dopo <BODY> in HTML.
All’interno del corpo principale inseriremo tutte le istruzioni
del nostro programma, comprendendo eventualmente tutte le eventuali
chiamate a funzioni già inserite nell’intestazione.
Il gestore degli eventi
L’interattività tra l’utente ed il programma viene fornita
dal gestore degli eventi, il quale rileva in tempo reale tutti gli
spostamenti del mouse, la pressione dei tasti del mouse e della
tastiera ma anche di altri eventuali strumenti di input installati
sulla macchina.
Vediamo ora un breve e semplice esempio:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="Javascript">
function Saluto()
{
window.alert("Salve, amici di SoftwarePlanet!");
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<input type=button value="Clicca per invocare la funzione
Saluto()" onClick="Saluto()">
</FORM>
</BODY>
</HTML>
In questo esempio è stato realizzato un bottone (<input type=button
… ), alla cui pressione viene invocata la funzione Saluto()
( … onClick="Saluto()"> ), quest’ultima utilizza
un METODO inserito all’interno della funzione: alert.
Per visualizzare questo esempio:
http://www.softwareplanet.net/MaterialeCorsi/CorsoJavaScript/Esempio-002.1.htm
I metodi
Un metodo è una specie di funzione appartenente ad un oggetto, ed
è il sistema per manipolare o maneggiare le proprietà dell’oggetto.
In questo caso l’oggetto è window, il suo metodo è alert che
consente di vedere a video una finestra di warning o di avvertimento.
In termini pratici, alla pressione del bottone, verrà visualizzato
al centro dello schermo ‘Salve, amici di SoftwarePlanet!’
I metodi, quindi, sono proprietà degli oggetti, e noi dobbiamo imparare
a sfruttare tutte queste proprietà a nostro vantaggio.
Anche nella vita quotidiana utilizziamo dei metodi, a volte senza
rendercene conto, per esempio supponiamo di avere un oggetto: la
lampadina. Questo oggetto ha due possibilità, essere: accesa (ON)
o spenta (OFF). Il metodo, per cui sarà possibile cambiarne lo stato
è l’interruttore.
Se dovessimo avere questa situazione in Javascript, sintatticamente,
e facendo una analogia con il metodo alert, potremmo scrivere in
questo modo per accendere la luce:
lampadina.interruttore(“ON”); oppure lampadina.interruttore(1);
e scrivere così per spegnere la luce:
lampadina.interruttore(“OFF”); oppure lampadina.interruttore(0);
interruttore ,dunque, è il metodo dell’oggetto lampadina.
Adesso proviamo un altro semplicissimo esempio facendo conoscenza
con il metodo write:
Il metodo write
Sul famoso manuale del linguaggio C (Kerninghan-Ritchie), ma anche
su altri manuali di linguaggi di programmazione, uno dei primi esempi
che viene realizzato è fare apparire la celebre frase: “Salve
Mondo!”.
Proviamo a realizzare questo esempio in Javascript:
<HTML>
<HEAD>
</HEAD>
<BODY>
<SCRIPT LANGUAGE="Javascript">
document.write(“Salve Mondo!”);
</SCRIPT>
</BODY>
</HTML>
Per visualizzare questo esempio:
http://www.softwareplanet.net/MaterialeCorsi/CorsoJavaScript/Esempio-002.2.htm
Nei linguaggi di programmazione ad oggetti, la notazione del punto
interposta tra document e write indica l’appartenenza di quest’ultimo
a document, come metodo.
Praticamente write è un metodo dell’oggetto document, in questo
caso il suo scopo è di fare apparire sul browser la stringa di caratteri
“Salve Mondo!” .
Infine al termine di ogni istruzione Javascript interpreta il punto
e virgola come fine istruzione.
Finora abbiamo visto che Javascript è un linguaggio molto simile
ad altri linguaggi di programmazione, la cui grammatica è molto
semplice da acquisire. Potremmo azzardare questa definizione: “Javascript
rispetta le direttive della programmazione strutturata, ma è basato
sugli OGGETTI, che possiedono delle proprietà. Queste proprietà
possono essere delle VARIABILI, e quindi hanno un determinato valore,
oppure possono essere dei METODI, ovvero delle funzioni in grado
di svolgere determinati compiti.”
Javascript è stato realizzato prevalentemente per arricchire il
linguaggio di formattazione HTML. Le istruzioni Javascript sono
di grande ausilio non solo per il WebDesigner, che potrà utilizzare
le sue potenzialità per migliorare le pagine web, ma anche per il
programmatore che avrà il controllo del linguaggio CLIENT-SIDE,
ovvero dalla parte del browser.
Nella prossima parte, vedremo che esistono due tipi di Javascript:
lato server (SERVER-SIDE), e lato client (CLIENT-SIDE).
Torna all'indice Generale del corso di Corso di JavaScript di Software Planet