Introduzione a JavaScript Linguaggio di scripting non di

Transcript

Introduzione a JavaScript Linguaggio di scripting non di
Introduzione a JavaScript
Linguaggio di scripting non di programmazione: può controllare il comportamento del browser e il
suo contenuto ma non può effettuare elaborazioni grafiche o gestire la rete.
Le caratteristiche1 peculiari di Javascript sono:
•
•
•
•
•
Linguaggio interpretato;
Linguaggio basato sugli oggetti: object-based cioè si possono usare proprietà (attributi e
metodi) di oggetti predefiniti e crearne di nuovi (non “orientato” agli oggetti: non si può usare
ad esempio il concetto di ereditarietà e polimorfismo2; JavaScript, infatti, non supporta le classi)
Linguaggio guidato dagli eventi (event-driven)
Il nucleo del linguaggio è incorporato nel browser
Esiste in almeno due varianti: lato client (più comune per rendere dinamiche le pagine Web cioè
inserisce contenuti eseguibili: programmi che interagiscono con l’utente, controllano browser e
creano dinamicamente contenuti HTML nuovi) o lato server.
Cosa c’è in Javascript
Gli elementi3 di un programma Javascript possono essere divisi in 5 categorie:
− variabili e valori
− espressioni ed operatori
• per manipolare i valori
− strutture di controllo
• per modificare l’ordine di esecuzione
− funzioni
• per raggruppare blocchi di istruzioni
− oggetti ed array (con dimensione dinamica, anche non omogenei)
• raggruppamenti di dati e funzioni
Commenti in Javascript
Stessa tecnica del C++ o di Java
Commenti su di una singola linea
Commenti su più linee
//
Inizio commento /*
Fine commento */
Punto e virgola opzionale
Ogni istruzione dovrebbe terminare con il punto e virgola (;)
Può essere omesso se due istruzioni sono separate da un invio
Nel seguente caso è obbligatorio
Conviene sempre metterlo
1
a=3
b=4
a = 3; b = 4;
da P.Gallo, F.Salerno “ HTML, CSS, Javascript“ Minerva Italica
Per un’introduzione al confronto con un linguaggio Orientato agli Oggetti (Java)
3
da Carlo Blundo “Tecnologie di Sviluppo per il WEB”
2
Identificatori
Un identificatore è semplicemente un nome
In JavaScript gli identificatori si usano per dare un nome a
− Variabili
− Funzioni
− Per fornire delle etichette per alcuni cicli
− I nomi degli identificatori devono seguire delle regole (le vedremo quando tratteremo le
variabili)
Letterali
Un letterale è un valore fissato che compare all’interno di un programma JavaScript
Esempi di letterali
− 12
− 1.2
−
“ciao” //una stringa
−
'ciao' // un altro modo per indicare una stringa
− true, false
− null
Ci sono anche letterali funzione, letterali oggetto e letterali array
Valori
Javascript riconosce i seguenti tipi di valori
− Numeri
− Valori booleani
− Stringhe
// oggetti interni
− null
// può essere assegnato ad una variabile
• Indica un valore nullo
− undefined
• Indica che una variabile ha un valore indefinito
Numeri interi
decimali: (compresi tra – 253e 253)
− e.g., 77 -9876453
ottali (iniziano con zero):
− e.g., 077 -09876
esadecimali (iniziano con 0x o 0X):
− e.g., 0x77 oppure 0X123456789abcDEF
Numeri in virgola mobile
Notazione standard
− 1234.567 oppure -1.234
Notazione scientifica
(se minori di 1.0e-7 oppure maggiori di 1.0e20)
− 1.2345e10 1.1234e-11
9. 87E-21
Valore massimo ±1.7976931348623157x10308
Valore minimo ±5x10-324
Costanti numeriche speciali
Infinity * oppure Number.POSITIVE_INFINITY
− Valore speciale per rappresentare “infinito”
nNaN * oppure Number.NaN
− Valore speciale per rappresentare un “non-numero”
Number.MAX_VALUE
− il più grande numero rappresentabile
Number.MIN_VALUE
− il più piccolo numero rappresentabile
Number.NEGATIVE_INFINITY
− valore speciale per rappresentare “infinito negativo”
* Non implementate prima di JavaScript1.3
Costanti
Variabili a sola lettura
Sono create usando la parola chiave const
− const sconto=0.1;
− const nome=“pippo”;
Esistono in JavaScript anche delle costanti predefinite che rappresentano i più comuni valori
matematici (accessibili attraverso l’oggetto math)
Valori booleani
Possono assumere il valore true o false
JavaScript, se è necessario, converte true in 1 e false in 0
Utilizzo
if (a = = 4)
b = b + 1;
else
a = a + 1;
Valori stringa
Sono letterali di zero o più caratteri racchiusi tra virgolette doppie (") o singole (')
Esempi
""
// stringa vuota
"casa"
'cassa'
"1234"
"una riga \n un’altra riga"
'nome= "carlo"'
//stringa nome ="carlo"
Caratteri speciali
Oltre ai caratteri ordinari o a quelli espressi in UNICODE (\uXXXX, dove X è un valore
esadecimale), si possono inserire nelle stringhe i seguenti caratteri speciali
− \' (apice singolo)
−
\" (apice doppio)
−
\b (backspace)
−
\f (form feed) cioè avanzamento di pagina
−
\n (interruzione di linea) cioè inizio riga
− \r (ritorno carrello)
−
\t (tabulazione)
− \\ (backslash)
−
\v (tab. verticale)
− \0 (carattere NUL)
Parole riservate
Sono : abstract / boolean / break / byte / case / catch / char / class / const / continue / debugger /
default / delete / do / double / else / enum / export / extends / false / final / finally / float /for /
function / goto/ if / implements / import /in /instanceof / int / interface /long /native / new /
null / package / private / protected / public / return / short / static /super / switch /
synchronized / this / throw /throws /transient /true /try /typeof /var /void /volatile /while /with
Variabili in Javascript
Le variabili sono nomi simbolici associati a valori in applicazioni Javascript.
I nomi delle variabili devono seguire alcune regole
− Il primo carattere deve essere una lettera, un underscore (_) oppure il segno del dollaro ($)
− I caratteri seguenti possono essere lettere, cifre, oppure il segno del dollaro (non ci possono
essere spazi)
− Non possono essere uguali a parole riservate
Javascript è case sensitive
− Var1 e’ diverso da var1
Tipo delle variabili
Javascript non è un linguaggio tipato
− Alla stessa variabile possiamo assegnare valori di tipo differente senza generare errori
Esempio
<script type=“ text/javascript” >
<!-var altezza=2+3.4;
document.write(altezza);
/* funzione predefinita o metodo write per scrivere sul documento
con document oggetto browser dipendente o oggetto Navigator */
document.write(“<BR>”);
/* funzione predefinita anche metodo writeln per scrivere nel
browser la stringa di testo passata come parametro con “a capo” */
altezza=“5.4 metri”;
document.write(altezza);
// -->
</script>
Dichiarazione di variabili
Non è necessario dichiarare le variabili anche se è buona norma farlo sempre
Per dichiarare una variabile possiamo semplicemente assegnarle un valore
− i =10;
// a questo punto i è dichiarata
− str = "Ciao \n mondo!";
// a questo punto str è dichiarata
Per dichiarare una variabile si usa la parola chiave var
− var i;
− var r, d;
− var s=“ciao”;
Possiamo dichiarare con var una variabile più di una volta senza causare errori
Se si crea all’interno di una funzione una variabile senza far ricorso a var, allora si crea una
variabile globale
Inizializzazione di variabili
Possiamo inizializzare una variabile quando la dichiariamo
− var i=10;
Una variabile dichiarata ma non inizializzata è indefinita
− Se tentiamo di leggere il suo contenuto otteniamo undefined
− Se tentiamo di accedere ad una variabile non dichiarata otteniamo un errore al runtime
Campo di visibilità di una variabile
Esistono solo due campi di visibilità
Locale – Variabili definite all’interno di una funzione attraverso la parola chiave var
Globale – Variabili definite in qualsiasi punto del documento, ma al di fuori di una funzione;
oppure in una funzione senza utilizzare var
In JavaScript non esiste il campo di visibilità di blocco (block scope)
Esempio
function test(o)
{ var i=0;
if(typeof 0 = = “object”)
{ var j;
for(var k=0; k<10; k++)
{document.write(k);}
document.write(j);
}
document.write(i);
}
Le variabili i j e k hanno lo stesso campo di visibilità (scope), quello della funzione. Sono visibili in
tutto il corpo della funzione non soltanto nei singoli blocchi.
Oggetti in Javascript
Un oggetto in JavaScript è una collezione4 di valori con nome (named values).
JavaScript non supporta le classi e, a differenza di linguaggi OO, usa oggetti di cui può modificare
proprietà o crea tale insieme di dati (attributi) e di funzioni (metodi) con riferimento ad un
prototipo cioè la funzione costruttore.
Per far riferimento ad una proprietà di un oggetto si fa riferimento al nome dell’oggetto seguito dal
punto (.) e dal nome della proprietà. Con sintassi: nomeOggetto.nomeAttributo
Se la definizione del tipo dell’oggetto contiene una funzione, allora la funzione prende il nome di
metodo dell’oggetto ed il named value diventa il nome del metodo.
Per richiedere l’esecuzione di tale funzione si userà sempre la dot-notation con sintassi
nomeOggetto.nomeMetodo(par1, par2,..)
Una variabile è fondamentalmente la stessa cosa di una proprietà di un oggetto.
Vediamo un esempio di definizione di prototipo cioè tipo di un oggetto in JavaScript che avviene
tramite l'implementazione di quello che viene chiamato metodo 'costruttore'.
Un costruttore, come nei linguaggi OO, non è altro che un metodo che viene richiamato quando
l'oggetto viene istanziato e ha il compito di inizializzare la nuova istanza dell'oggetto secondo valori
prestabiliti o in base ai parametri ricevuti.
Proviamo a fare una similitudine, così come la matrice rappresenta l'originale da cui stampare le
banconote, così il tipo dell'oggetto, consistente nell'elenco di una serie di proprietà e funzioni che ne
individuano le caratteristiche ed il comportamento è l'originale da cui, attraverso l'atto dell'istanza
generare una variabile avente le sue stesse caratteristiche.
Esempio
Come esempio, proviamo a definire un tipo di oggetto che possa poi essere utilizzato come
un'anagrafica e cioè che sia caratterizzato da un nome, un giorno di nascita, un mese, ed un anno.
Si vuole inoltre poter visualizzare nella finestra del browser, all’interno del documento, i dati di
quella particolare istanza.
Procediamo quindi a scrivere il costruttore del tipo Anagrafica:
function Anagrafica (Nome, Giorno, Mese, Anno) {
this.Nome = Nome;
this.Giorno = Giorno;
this.Mese = Mese;
this.Anno = Anno;
this.Visualizza = StampaOggetto;
}
La parola chiave this, utilizzata all'interno del costruttore è un modo per far riferimento ad una
proprietà dell'oggetto sul quale si lavora.
4
Una specie di struttura in C; in genere si fa riferimento ai named values con il nome di proprietà
Nell’esempio proposto sarà necessario aver precedentemente definito la funzione StampaOggetto()
<SCRIPT LANGUAGE="javascript">
<!—
function StampaOggetto(){
document.write ("Dati in archivio:");
document.write ("Nome: "+this.Nome);
document.write ("Giorno: "+this.Giorno);
document.write ("Mese: "+this.Mese);
document.write ("Anno: "+this.Anno);
}
function Anagrafica (Nome, Giorno, Mese, Anno) {
this.Nome = Nome;
this.Giorno = Giorno;
this.Mese = Mese;
this.Anno = Anno;
this.Visualizza = StampaOggetto;
}
//-->
</SCRIPT>
In questo modo, per visualizzare le proprietà di un oggetto di tipo Anagrafica, si istanzia ad
esempio con il nome Antonio,
Antonio = new Anagrafica ("Antonio", 11, "Novembre", 1968);
e si chiederà come servizio all’oggetto Antonio di visualizzarle:
Antonio.Visualizza(); // esecuzione del metodo
Codice completo della pagina web:
da http://www.amagri.it/programmazione/javascript/oggetti.htm
<HTML>
<HEAD>
<SCRIPT LANGUAGE="javascript">
<!-function StampaOggetto () {
document.write ("Dati in archivio:");
document.write ("<BR>Nome: "+this.Nome);
document.write ("<BR>Giorno: "+this.Giorno);
document.write ("<BR>Mese: "+this.Mese);
document.write ("<BR>Anno: "+this.Anno);
}
function Anagrafica (Nome, Giorno, Mese, Anno) {
this.Nome = Nome;
this.Giorno = Giorno;
this.Mese = Mese;
this.Anno = Anno;
this.Visualizza = StampaOggetto;
}
Antonio = new Anagrafica ("Antonio", 11, "Novembre", 1968); // crea istanza
Antonio.Visualizza(); // esecuzione del metodo
//-->
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>
Effetto
In JavaScript si può aggiungere una proprietà ad una particolare istanza di un oggetto. Ad
esempio scrivendo:
Antonio.Indirizzo = "Via Parma, Chiavari";
si aggiunge la proprietà Indirizzo all'istanza Antonio dell'oggetto Anagrafica.
Questa operazione non avrà alcun effetto sugli altri oggetti dello stesso tipo che sono già stati
istanziati o che lo saranno in seguito.
Per aggiungere una proprietà ad un oggetto si può utilizzare la parola chiave prototype. In
questo caso la proprietà verrà aggiunta alla definizione del tipo dell'oggetto e quindi avrà effetto su
tutti gli oggetti già istanziati o che istanzieremo. La sintassi è la seguente:
Anagrafica.prototype.NomeProprietà = ValoreProprietà;
potendo inizializzare ad un valore nullo (uso della parola chiave null) come nel seguente esempio:
Anagrafica.prototype.Indirizzo = null;
Antonio.Indirizzo = "Via Parma, Chiavari;
Claudio.Indirizzo = "Via Merano, Mesagne";
Entrambe le possibilità illustrate per aggiungere proprietà non sono un modo consigliato di
procedere; si dovrebbe infatti progettare con attenzione il tipo di oggetto e non modificarne in
seguito la definizione.
Le principali famiglie di oggetti in Javascript
•
“Riflessi” da HTML (creati automaticamente dal browser per ogni elemento di un documento
HTML)
•
Interni o integrati (non legati al browser né al documento HTML: Array, String, Date, Math)
•
Browser-dipendenti5 (detti oggetti Navigator, “riflessi” dall’ambiente del browser)
•
Definiti dall’utente (richiedono prima la definizione di una classe cioè una famiglia di oggetti
con le stesse caratteristiche o attributi e comportamenti o metodi tra i quali il costruttore che
servirà ad inizializzare i valori degli attributi poi la creazione con operatore new )
L’oggetto globale
Quando l’interprete JavaScript va in esecuzione una delle prime cose che fa è creare un oggetto
globale.
Le proprietà di questo oggetto globale sono le variabili dichiarate all’interno di programmi
JavaScript.
Quando si dichiara una variabile si sta definendo una proprietà dell’oggetto globale.
L’interprete JavaScript inizializza questo oggetto con altri valori e funzioni predefinite.
Per far riferimento a questo oggetto in codice javaScript che non fa parte di funzioni possiamo usare
la parola chiave this
− All’interno di funzioni this ha un significato differente (è un riferimento all’oggetto corrente)
•
In JavaScript lato client l’oggetto Window serve da oggetto globale (è il padre della gerarchia
che contiene document che contiene oggetti “riflessi” da HTML quali links, … images, forms
contenitore di elements quali text, button etc… Ogni discendente è una proprietà dell’antenato)
− Per far riferimento a this possiamo usare la proprietà auto-referenziale window dell’oggetto
globale Window
Il call object
Le variabili locali (quelle dichiarate all’interno di una funzione) sono anch’esse proprietà di un
oggetto chiamato call object.
Il “tempo di vita” di un call object è la durata dell’esecuzione della funzione a cui è associato.
5
Una pagina web viene scomposta da JavaScript in un modello ad oggetti (ognuno con le sue proprietà) in relazione
reciproca. Oggetti “di livello massimo” nella gerarchia degli oggetti JavaScript: Window, document, location,
navigator e history
Espressioni ed operatori
Espressione
Un’espressione è una frase JavaScript che l’interprete JavaScript può valutare per produrre un
valore. Un’espressione è un insieme valido di letterali, variabili, operatori ed espressioni che una
volta valutata produce un singolo valore; il valore può essere un numero, una stringa o un valore
logico (true/false).
Il valore di un’espressione letterale è il valore del letterale stesso
− “casa”
Il valore di un’espressione variabile è il valore che la variabile contiene o a cui fa riferimento
− a = 5;
È possibile combinare delle espressioni attraverso degli operatori per ottenere espressioni più
complesse
Tipi di operatori
Unario
− L’operatore ha un solo operando Ad esempio, -3
Binario
− L’operatore ha due operandi. Ad esempio, 3+4
Ternario
− L’operatore ha tre operandi. Ad esempio, a < 4 ? 3 : 4;
Operatori aritmetici
x + y addizione
x – y sottrazione
x * y moltiplicazione
x / y divisione, restituisce double
++i incremento prefisso
i++ incremento postfisso
--i decremento prefisso
i-- decremento postfisso
-i
negazione
x % y modulo
Operatori relazionali
Restituiscono un valore booleano
x > y maggiore di
x >= y maggiore o uguale a
x < y minore di
x <= y minore o uguale a
a in x vero se a è una proprietà dell’oggetto x
y istanceof x vero se y è un’istanza della classe x
Esempio di in ed istanceof
var point = {x:1, y:1};
// x è un oggetto
if (x in point)
{
// istruzioni da eseguire}
var theDay=new Date(2003, 4, 29)
if (theDay instanceof Date)
{
// istruzioni da eseguire
}
Operatori di uguaglianza
a = = b uguaglianza – Restituisce vero se a e b sono uguali anche dopo conversioni
− 3 = = “3”restituisce vero
a = = = b identità – Restituisce vero se a e b sono uguali e sono dello stesso tipo
− 3 = = = “3”restituisce falso
−
Operatori di disuguaglianzana
a != b disuguaglianza
– Restituisce vero se a e b sono diversi anche dopo conversioni
− 3 != “2” restituisce vero
− a != = b non-identità – Restituisce vero se a e b non sono identici
− 3 != = “3” restituisce vero
Operatori su stringhe
Tutti gli operatori di relazione già visti
+ concatenazione
// conversione implicita : prevale string
"Ciao a voi " + 3; => "Ciao a voi 3"
L’operatore + usato con stringhe e numeri non è associativo:
1 + 2 + "gattini"; produce "3 gattini"
"gattini:" + 1 + 2; produce "gattini: 12"
conversione implicita da stringa a numerico: uso di operatore * che opera solo su operandi
numerici: X = “3” * 5 => X 15
Ancora su stringhe
Fate attenzione al confronto tra stringhe: la stringa “Casa” viene prima di abaco”
− In UNICODE (ma anche in ASCII) le lettere maiuscole vengono prima delle minuscole
Per convertire un numero x nella stringa "x" è sufficiente scrivere ""+x
− ""+3 produce "3"
Operatori logici
&& AND logico. Ad esempio
expr1 && expr2
|| OR logico. Ad esempio
expr1 || expr2
! NOT logico. Ad esempio
!expr
Le espressioni logiche vengono valutate da sinistra verso destra; l’interpretazione si arresta appena
diventa noto il valore dell’espressione
– 7 < 10 || “espressione”
“espressione” non verrà mai valutata
Operatori bitwise
Lavorano sui bit che rappresentano i loro operandi
& AND bitwise
|
OR bitwise
^
XOR bitwise
~
NOT bitwise
<< shift verso sinistra (x << 3;)
// moltiplicare per 2n_posizioni
>> shift verso destra (x >> 4;)
// dividere per 2n_posizioni
>>> shift verso destra con riempimento di 0
Assegnamento
Il più semplice tipo di operatore =
Esempi
– x=3; str=“casa”;
Assegnamento multiplo
− x = y = z = 0;
Esistono altri operatori di assegnamento che sono la forma abbreviata di operazioni standard
– E.g., x+=3; equivalente a x=x+3;
Forma abbreviata
x += y equivale a x = x + y
x -= y equivale a x = x - y
x *= y equivale a x = x * y
x /= y equivale a x = x / y
x %= y equivale a x = x % y
x <<= y equivale a x = x << y
x >>= y equivale a x = x >> y
x >>>= y equivale a x = x >>> y
x &= y equivale a x = x & y
x ^= y equivale a x = x ^ y
x |= y equivale a x = x | y
Operatore condizionale
Unico operatore ternario in JavaScript
Sintassi :
(condizione) ? expr1 : expr2
− restituisce la valutazione di expr1 se condizione è vera, altrimenti restituisce la valutazione di
expr2
− expr1 e expr2 possono avere tipi diversi
Operatore typeof
L’operatore typeof restituisce una stringa che indica il tipo dell’operando
Sintassi:
typeof operando
oppure
typeof (operando)
Esempio
if (typeof a = = "string")
// tipo di dato primitivo string
document.write(a + " &egrave; una stringa");
Esempi di typeof
– typeof parseInt
− typeof undefinedVariable
− typeof 33
− typeof "Ciao"
− typeof true
− typeof null
restituisce la stringa "function"
restituisce "undefined"
restituisce "number"
restituisce "string"
restituisce "boolean"
restituisce "object"
Operatore void
L’operatore void specifica un’espressione che deve essere valutata senza restituire un valore
Sintassi:
void espressione
oppure void (espressione)
Esempio di uso di void
Il seguente codice crea un link che fa aprire una nuova finestra del browser:
<a href=“ javascript:void window.open();” >Apri una nuova finestra </a>
Usato in concomitanza degli eventi (onClick, onMouseOver, … .)
Operatore virgola
Valuta il suo operando sinistro poi quello destro e restituisce il valore del suo operando destro
Esempio
− i=0, j=1, k=2;
assegna 0 ad i, 1 a j, e 2 a k e restituisce il valore 2
Altri operatori
new
– Serve a creare istanze di oggetti
delete – Serve a rimuovere proprietà di oggetti
()
– Operatore chiamata a funzione
[] e . – Operatori di accesso ad array ed oggetti. Si ricordi che gli oggetti array in JavaScript hanno
dimensione dinamica e possono essere anche non omogenei.
Istruzioni
Istruzioni JavaScript
In JavaScript la più semplice istruzione è un’espressione che ha un effetto collaterale
− s = 4 + i; oppure cont++;
In JavaScript possiamo combinare, usando le parentesi graffe più istruzioni in una singola istruzione
o istruzione blocco
{ x = Math.PI;
cx = Math.cos(x);
alert("cos(" + x + ") = " + cx);
}
Istruzioni condizionali
Un’istruzione condizionale è un insieme di comandi che vengono eseguiti se una condizione
specificata è vera
if
con sintassi: if (espressione) istruzioni
if else
con sintassi: if (espressione) istruzioni1 else istruzioni2
if else if con sintassi: if (espressione1) istruzioni1else if (espressione2) istruzioni2 else istruzioni3
Istruzione switch
Un’istruzione switch permette ad un programma di valutare un espressione e confrontare il valore
dell’espressione con un’etichetta (label) case.
Se si trova una corrispondenza, allora il programma esegue l’istruzione associata
La label può essere una qualsiasi espressione arbitraria, non necessariamente una costante al
tempo di compilazione come accade per il C, C++ o Java
Sintassi
switch (espressione)
{
case label1 :istruzione1;
break;
case label2 :istruzione2;
break;
...
default : istruzionen;
}
Può essere:
case 60*60*24:
case Math.PI:
case n+1:
case a[0]:
Esempio
switch (fruits)
{
case "Oranges" :document.write("Oranges are $0.59 a pound.<BR>");
break;
case "Apples" :document.write("Apples are $0.32 a pound.<BR>");
break;
case "Bananas" :document.write("Bananas are $0.48 a pound.<BR>");
break;
case "Cherries" :document.write("Cherries are $3.00 a pound.<BR>");
break;
default :document.write("Sorry, we are out of " + i + ".<BR>");
}
Istruzioni di ciclo
Un ciclo è un insieme di comandi che vengono eseguiti ripetutamente fino a quando una condizione
specificata è soddisfatta. Semplificano azioni ripetitive:
while
do while
for
for in
Ciclo for
Sintassi:
for (assegnamento; condizione; incremento) istruzioni
Esempi
for (count = 0; count < 10; count++)
document.write(count + "<br>");
for (i = 0, j = 10 ; i < 10 ; i++, j--)
sum += i * j;
Ciclo while
Sintassi:
// opzionali
while (condizione) {istruzioni}
Esempio
var count = 0;
while (count < 10)
{
document.write(count + "<br>");
count++;
}
Ciclo do while
Sintassi:
do {istruzione} while (condizione );
Esempio
var i=0;
do {
i+=1;
document.write(i);
} while (i<5);
Ciclo for in
Sintassi:
for (variable in object) statement
Esempio
for (prop in my_object)
{
nome= "Nome: " + prop;
valore= "Valore: " + my_object[prop];
document.write(nome + " - " +valore+ "<br>");
}
label
Con una label possiamo fornire un identificativo ad un’istruzione. È usata in un ciclo in
concomitanza con break o continue
Sintassi
label:istruzione
Esempio
markLoop: while (theMark = = true) doSomething();
break
Con break forziamo l’uscita dal ciclo più interno che lo racchiude o da uno switch
Sintassi:
break
oppure
break label;
Esempio
for (i = 0; i < a.length; i++)
{
if (a[i] == target)
break;
}
continue
È usato solo all’interno di un ciclo, interrompe il ciclo e va a controllare la condizione
Sintassi:
continue
Esempio
oppure continue label;
i = 0;
n = 0;
while (i < 5) {
i++;
if (i = = 3)
continue;
n += i;
}
Esempio di continue con label
checkiandj :while (i<4) {
document.write(i + "<BR>");
i+=1;
checkj :while (j>4) {
document.write(j + "<BR>");
j-=1;
if ((j%2)= =0)
continue checkiandj;
document.write(j + " is odd.<BR>");
}
document.write("i = " + i + "<br>");
document.write("j = " + j + "<br>");
}
Istruzione with
L’istruzione with stabilisce l’oggetto di default per un insieme di istruzioni
Sintassi: with (oggetto){istruzioni }
Per identificativo che compare in istruzioni si verifica se è una proprietà di oggetto
L’uso di with rallenta l’esecuzione
Esempio di with
x = Math.sin(i * Math.PI / 20);
y = Math.cos(i * Math.PI / 30);
Può essere trasformato in
with(Math) {
x = sin(i * PI / 20);
y = cos(i * PI / 30);
}
Istruzioni non ancora esaminate
function
throw
try/catch/finally
– Definizione di funzioni
– Generazione di un’eccezione
– Meccanismo di gestione delle eccezioni
Modalità di inserimento in pagine web ed esecuzione: sintesi
Le istruzioni JavaScript possono essere inserite in modi diversi:
1. all'interno degli script (tra i tag <SCRIPT>);
2. caricandole da un file esterno specificando un file come sorgente JavaScript; può essere utile
quando questo script debba essere utilizzato su più pagine.
Le istruzioni JavaScript possono essere eseguite in modi diversi:
1. In seguito all'attivazione di un evento, solitamente come gestore di eventi all’interno di certi tag
HTML.Gli eventi si possono attivare, forzandoli, anche all'interno degli script, come se fossero
delle proprietà dell'oggetto:
Oggetto.gestore_evento = handler_code;
Ad un evento può essere associata un’unica istruzione, ma di solito l'associazione viene fatta con un
blocco di istruzioni: tale funzione, attivata dal gestore di evento (event handler del tipo
onNome_Evento) è detta handler code facendo riferimento alla funzione implementata dall’utente
che realizza la risposta all’evento.
È caso particolare la pressione su pulsante di tipo submit – controllo in un form – che lancia in
esecuzione il codice eseguibile impostato come valore dell'atttributo action del form stesso:
<form action ="javascript: comando">
<input type="submit" value="Esegui">
</form>
2. in luogo di un link nella forma <A HREF = "javascript: comando">, inserendo un’espressione
JavaScript come valore di un attributo HTML
3. valori JavaScript possono essere richiamati dall'HTML “al volo” includendoli tra i caratteri &{ e
};%. Occorre osservare che sotto Internet Explorer queste espressioni non sono gestite.