1 – Inizio

I requisiti per poter seguire questo corso sono conoscenze di:

  • variabili
  • espressioni elementari
  • selezione (if else)
  • cicli
  • funzioni
  • vettori
  • struct
  • html
  • CSS

Il Javascript è un cosiddetto linguaggio di scripting che permette di aggiungere comportamenti ai tag html.

Tutto il codice java script (d’ora in poi abbreviato con js) viene inserito nel tag di apertura <script> e di chiusura </script>

<script language="JavaScript"></script>

anche se formalmente più corretto utilizzare type

<script type="text/javascript"></script>

Il tag <script> può essere inserito sia nell’ <head> che nel <body>

inseriamo il primo comando, alert, che stampa a video un messaggio nel browser

<script type="text/javascript">
    alert("Questo è JavaScript!");
</script>

Come si può notare ogni istruzione js termina col punto e virgola.

Inoltre js è case sensitive, ovvero differenzia le maiuscole dalle minuscole, per ricordarsi i comandi una regola comune di js è che nei comandi che contengono 2 parole, la prima è in minuscolo la seconda inizia col maiuscolo (onClick). Mentre negli oggetti preconfezionati dal linguaggio (tipo l’oggetto Math) la prima è lettera è maiuscola:

alert('il valore pi greco è:' + Math.PI);

la prima parte dell’alert è una stringa alla quale concateno (col segno +) la proprietà PI costante dell’oggetto Math.

Le stringhe possono essere delimitate o dalle virgolette o dall’apice. Se dovessimo usare un carattere delimitatore (tipo ‘ o “) all’interno della stringa, basta farlo precedere da uno slash \

alert('Questo e\' Javascript');

oppure

alert("Questo e' Javascript");

In realtà alert non è un comando, ma un metodo di un oggetto predefinito del js chiamato window. Il linguaggio riesce a determinare in automatico l’oggetto contenitore e a sopperire alla sua mancata dichiarazione, la forma corretta sarebbe

window.alert("Quest e' Javascript");

Vediamo un esempio del metodo moveTo sempre dell’oggetto window che serve a spostare la finestra del browser secondo le coordinate specificate come argomenti window.moveTo(x,y)

<script type="text/javascript">
   for (i=1;i<=300;i++)
       window.moveTo(Math.round(Math.random()*300), Math.round(Math.random()*300));
</script>

La prima riga è il ciclo for che come parametri vede l’inizializzazione (i=1) , seguita dalla terminazione (i<=300) e si conclude con l’ incremento contatore (i++) . Il ciclo termina quando la condizione della terminazione è soddisfatta (in questo esempio viene seguito 300 volte). L’incremento i++ incrementa di una unità il valore della variabile i.

Il valore della coordinata x, nel ns caso, è Math.round(Math.random()*300). Random genera un numero casuale decimale compreso tra 0 e 1. Viene poi moltiplicato per 300 e tramite il metodo round viene approssimato al numero intero più vicino.