JavaScript/Il nostro primo programma: differenze tra le versioni

Contenuto cancellato Contenuto aggiunto
m Update syntaxhighlight tags - remove use of deprecated <source> tags
Riga 7:
 
All'interno del tag <code>script</code> una volta, per problemi di compatibilità con i browser che non supportavano i JavaScript, il testo veniva delimitato da i delimitatori di commento, per evitare che il codice venisse mostrato in forma "grezza". Ad esempio:
<sourcesyntaxhighlight lang=html4strict>
<script>
<!--
Riga 13:
-->
</script>
</syntaxhighlight>
</source>
Questo accorgimento è tuttavia oggi sconsigliato, oltre ad essere praticamente superfluo in quanto la maggior parte dell'utenza utilizza browser JavaScript-compatibili.
 
È possibile inoltre usare l'attributo <code>src</code> per inserire un codice JavaScript esterno (solitamente un file con estensione ''.js''). In questo caso viene lasciato vuoto lo spazio all'interno del tag. Ad esempio:
<sourcesyntaxhighlight lang=html4strict><script src="script.js"></script></sourcesyntaxhighlight>
 
Il codice JavaScript può essere inserito sia nella sezione <code>head</code> che nella sezione <code>body</code> della pagina HTML, ma le istruzioni vengono comunque eseguite in ordine (a parte nei casi di funzioni che però vedremo più avanti nel corso del libro); la differenza principale è sostanzialmente che il codice dentro <code>head</code> viene eseguito durante il caricamento della pagina, mentre dentro <code>body</code> viene azionato quando richiamato.
Riga 27:
== Ciao, Mondo! ==
Eccoci finalmente al nostro primo programma JavaScript: queste poche righe di codice identificano una pagina HTML su cui viene stampato ''Hello, world!''. Create il seguente file con un qualsiasi editor e apritelo con il vostro browser:
<sourcesyntaxhighlight lang=html4strict>
<html>
<head>
Riga 38:
</body>
</html>
</syntaxhighlight>
</source>
Analizziamo l'unica riga di codice JavaScript presente nella pagina:
<sourcesyntaxhighlight lang=javascript>
document.write("Hello, world!");
</syntaxhighlight>
</source>
Quando il browser analizza la pagina, nel momento in cui incontra le [[w:Istruzione (informatica)|istruzioni]], se non indicato diversamente (come vedremo più avanti), le esegue secondo l'ordine nel quale sono indicate, ovvero in '''[[w:Sequenza (informatica)|sequenza]]''' (questa operazione è chiamata ''[[w:Parsing|parsing]]'').<br/>
Le istruzioni sono sempre separate da un punto e virgola (;), ma JavaScript separa ugualmente le istruzioni se intervallate da ritorni a capo. <br/>
Riga 49:
 
Cerchiamo di capire meglio come avviene il ''parsing'' di uno script JavaScript. Essendo infatti il browser piuttosto veloce a interpretare il codice, non è possibile ai nostri occhi notare l'esecuzione dello script, e sulla pagina compare subito il testo ''Hello, world!''. Modifichiamo quindi il nostro codice come segue:
<sourcesyntaxhighlight lang=javascript>
...
<script>
Riga 57:
</script>
...
</syntaxhighlight>
</source>
[[Image:JavaScript AlertBox.jpg|left|thumbnail|Un alertbox in tedesco visualizzata dal browser [[w:Konqueror|Konqueror]]]]Il metodo <code>alert</code> mostra una finestrella contenente il testo indicato tra parentesi e un pulsante "OK". Quando viene eseguito, il ''parsing'' della pagina si ferma fino a quando l'utente non clicca sul bottone OK; possiamo quindi capire meglio come lavora il browser: l'esecuzione dello script si fermerà infatti due volte in corrispondenza delle due istruzioni <code>alert</code>. Quando viene mostrato il primo messaggio la pagina in secondo piano apparirà vuota, perché non vi è ancora stato impostato il contenuto; quando viene mostrato il secondo messaggio comparirà anche il testo ''Hello, world!'' in quanto sarà stata già eseguita il metodo <code>write</code>.
 
Riga 65:
In JavaScript è possibile inserire dei [[w:Commento (informatica)|commenti]], ovvero porzioni di testo che verranno ignorate dal parser, di una o più righe delimitandoli da <code>/*</code> e <code>*/</code>.
È possibile inoltre prevedere commenti di una sola riga utilizzando <code>//</code>. Ad esempio:
<sourcesyntaxhighlight lang=javascript>
questo codice verrà interpretato
/* questo verrà ignorato*/
Riga 76:
//e questo neppure!
mentre questo sì
</syntaxhighlight>
</source>