javascript – 1 · java) hanno il ... • per raggruppare blocchi di istruzioni – oggetti ed...
Post on 16-Feb-2019
224 Views
Preview:
TRANSCRIPT
Javascript – 1
Introduzione
Tecnologie di Sviluppo per il WEB 2
Cosa è Javascript
JavaScript (sviluppato da Netscape all’origine era chiamato LiveScript) è un linguaggio di scripting per client e server web
I programmi scritti in Javascript sono interpretati
Un software deve interpretare ed eseguire le istruzioni scritte in Javascript.
Tecnologie di Sviluppo per il WEB 3
Layout (rendering) engine Sono componenti software (web
browser/layout/rendering engine, ad esempio WebKit e Gecko) che prendono del contenuto (HTML, XML, immagini, etc.) e informazioni per la formattazione (CSS, XSL, etc.) e mostrano sullo schermo il contenuto formattato
Includono anche un Javascript engine– Chrome (WebKit): V8 (ver. 1.8)– Safari (WebKit): Nitro (ver. 1.7)– Firefox 7 (Gecko 2): Jaegermonkey– IE9 (Trident) : Chakra
Tecnologie di Sviluppo per il WEB 4
ECMA – 1 La European Computer Manufacturers
Association (ECMA) è un organismo europeo che si occupa di standard
Ha pubblicato tre versioni di EMCA-262 che standardizza il linguaggio Javascript chiamandolo ECMAScript– ECMA v1– ECMA v2– ECMA v3
• Sia JavaScript1.5 (NN) che JScript5.5 (IE) sono conformi a questa versione
Tecnologie di Sviluppo per il WEB 5
ECMA – 2 Lo standard ECMA può essere reperito online
presso
http://www.ecma-international.org/publications/standards/ECMA-262.HTM
Lo standard ECMA-262 è anche approvato dall’ISO (International Organization for Standards) come ISO-16262.
Tecnologie di Sviluppo per il WEB 6
Riferimenti online http://devedge-temp.mozilla.org/library/manuals/
In particolare:– Core JavaScript Guide 1.5
http://…/manuals/2000/javascript/1.5/guide/
– Core JavaScript Reference 1.5 http://…/manuals/2000/javascript/1.5/reference/
Tecnologie di Sviluppo per il WEB 7
Ottimo libro su Javascript
David FlanaganJavascript – The Definitive GuideO’Reilly
Tecnologie di Sviluppo per il WEB 8
Versioni di JavaScript
JavaScript1.6 (versione attuale)– Implementato da Mozilla e Netscape 6 e
superiori conforme con lo standard ECMA v3 Microsoft ha rilasciato varie versioni del
linguaggio JavaScript sotto il nome di JScript
Tecnologie di Sviluppo per il WEB 9
Javascript client-side – 1
HTML non può né gestire scelte dell’utente, né prendere decisioni, né iterare dei task
I linguaggi di script sono linguaggi di programmazione con sintassi semplice, che permettono di fare le cose utili con “pochi” comandi ad-hoc
I linguaggi di script per web combinano lo scripting con HTML per ottenere pagine interattive
Tecnologie di Sviluppo per il WEB 10
Javascript client-side – 2 Gli script per web indicano al browser la lista
di azioni che deve eseguire e quindi sono linguaggi interpretati (non compilati come Java)
Hanno il vantaggio di essere facilmente modificabili
Il risultato dipende molto anche dall’interprete (browser)– Anche se i browser moderni implementano molto
dello standard e sono quasi “compatibili”
Tecnologie di Sviluppo per il WEB 11
Javascript client-side – 3 Validano i dati delle form durante la
compilazione Visualizzano messaggi e possono richiedere
dati in apposite finestre (alert box) Animano il contenuto della pagina (e.g.,
immagini) interagendo con l’utente (e.g., spostamenti cursore)
Adattano le pagine ai browser che le visitano E altro ancora… (es. menu a tendina,
messaggi sulla linea di status del browser, aprono nuove finestre,… )
Tecnologie di Sviluppo per il WEB 12
Il tag SCRIPT È il tag contenitore per inserire codice
Javascript nella pagina HTML <SCRIPT> … </SCRIPT>
Gli attributi di SCRIPT sono:– language – type – src– defer
Il contenuto del tag SCRIPT viene interpretato dal browser come istruzioni in un linguaggio di scripting
Tecnologie di Sviluppo per il WEB 13
Gli attributi di SCRIPT – 1
language (deprecato)– Indica il linguaggio di scripting utilizzato
all’interno del tag SCRIPT• language=“Javascript”• language=“Javascript1.2”
type (usato al posto di language)– Descrive il mime-type utilizzato all’interno
del tag SCRIPT• type=“text/javascript”• type=”text/javascript;version=1.7”
Tecnologie di Sviluppo per il WEB 14
Gli attributi di SCRIPT – 2
src – Indica l’url di un file contenente codice
Javascript (non contiene HTML)– Il file in genere termina con estensione .js
•<SCRIPT type=“text/javascript” src=“codice/menu.js”></SCRIPT>
– Il tag di chiusura è richiesto
Tecnologie di Sviluppo per il WEB 15
Gli attributi di SCRIPT – 3
defer– Attributo boleano, indica al browser di
interpretare il contenuto del tag SCRIPT solo dopo che ha terminato di caricare tutto il documento HTML
– Lo si usa quando ci sono script che non producono output (e.g., definiscono una funzione e non usano document.write)
– La performance del browser aumenta
Tecnologie di Sviluppo per il WEB 16
Evitare language o type
Si può evitare di indicare ogni volta il tipo di linguaggio di scripting utilizzato, servendosi del tag META nella sezione HEAD
<meta http-equiv=“Content-Script-Type” content=“text/javascript”>
Tecnologie di Sviluppo per il WEB 17
Javascript e browser antiquati
Per vecchie versioni di browser che non “capiscono” Javascript si può utilizzare il seguente modello di commento
<SCRIPT TYPE=“text/javascript”> <!--… // --></SCRIPT>
Tecnologie di Sviluppo per il WEB 18
Browser e diverse versioni di javascript<SCRIPT LANGUAGE=“javascript”>
<!--languageVersion=“1.0”; // --></SCRIPT>
<SCRIPT LANGUAGE=“javascript1.2”> <!--languageVersion=“1.2”; // --></SCRIPT>
<SCRIPT LANGUAGE=“javascript1.5”> <!--languageVersion=“1.5”; // --></SCRIPT>
Tecnologie di Sviluppo per il WEB 19
Il tag NOSCRIPT
Permette di specificare cosa fare quando – il browser non sa interpretare Javascript– Javascript è stato disabilitato dall’utente
Dovrebbe essere usato ogni volta che si utilizza il tag SCRIPT– Redirigere il browser verso una pagina che non
contiene Javascript– Dettagli fra qualche slide …
Tecnologie di Sviluppo per il WEB 20
Esempio di utilizzo
<SCRIPT TYPE=“text/javascript”> <!--… // --></SCRIPT><NOSCRIPT><H1> Questa pagina richiede Javascript</H1></NOSCRIPT>
Si potrebbe redirigere la pagina attraverso il tagMETA (ma allora SCRIPT deve essere in HEAD)
Tecnologie di Sviluppo per il WEB 21
Dove posizionare il tag SCRIPT
Può andare nella sezione HEAD del documento HTML– In tal caso il codice contenuto viene
eseguito prima di visualizzare la pagina Può andare nella sezione BODY del
documento HTML– In tal caso il codice contenuto viene
eseguito quando il tag viene incontrato dal browser nel flusso normale della pagina
Tecnologie di Sviluppo per il WEB 22
Il primo script
<SCRIPT TYPE=“text/javascript">document.write(“Ciao mondo”);</SCRIPT> document si riferisce al documento html (è un
oggetto) write è un metodo di document
Tecnologie di Sviluppo per il WEB 23
Codice completo<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN"><HTML><HEAD><TITLE> Esempio di script </TITLE></HEAD>
<BODY><H1>Ecco il classico </H1>
<SCRIPT type="text/javascript"><!--document.write("Ciao mondo!");//--></SCRIPT>
</BODY></HTML>
Tecnologie di Sviluppo per il WEB 24
Un altro esempio
<SCRIPT TYPE=“text/javascript">out= "<FONT COLOR='RED'> Questo testo ”;out=out+”è di colore rosso</FONT>“;document.write(out);</SCRIPT> out contiene codice HTML da
mandare in output – all’interno delle virgolette
si usano gli apici
Tecnologie di Sviluppo per il WEB 25
…tornando a NOSCRIPT<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML> <HEAD> <TITLE> Esempio di NOSCRIPT</TITLE>
<SCRIPT TYPE="text/javascript">alert("Bravo!\n Il tuo browser supporta JavaScript");
</SCRIPT><NOSCRIPT>
<META HTTP-EQUIV="refresh" CONTENT="7;URL=pagina.html">
<h2>Per visualizzare questo sito hai bisogno di JavaScript</h2>
<h2>Fra sette secondi sarai direzionato verso una versione del sito che non fa uso di JavaScript</h2>
</NOSCRIPT></HEAD> <BODY> ...</BODY> </HTML>
esempio
Tecnologie di Sviluppo per il WEB 26
Ancora un esempio
<SCRIPT TYPE=“text/javascript">
oout= "<FONT COLOR='RED'>\ Questo testo è di colore rosso: " for(i=1;i<=6;i++){ out= oout + i; out += "</FONT><BR>"; document.write(out);}</SCRIPT>
esempio
Tecnologie di Sviluppo per il WEB 27
Tempo di esecuzione di uno script
Lo script viene eseguito in tempi diversi a seconda di dove è scritto il codice – Se invece il codice fa parte di una
funzione, allora viene eseguito solo (e sempre) quando la funzione viene invocata
Tecnologie di Sviluppo per il WEB 28
Interazione con l’utente Introduciamo a questo punto i metodi alert,
confirm e prompt dell’oggetto window Saranno utili per risolvere gli esercizi alert serve a mostrare una finestra per
l’output da parte del codice javascript confirm aspetta che l’utente prema OK o
Continua per continuare prompt serve a mostrare una finestra in cui
l’utente fornisce dell’input al codice javascript
Tecnologie di Sviluppo per il WEB 29
alert Mostra una finestra di dialogo contenente un
messaggio ed un bottone per chiuderla Sintassi
– alert(msg)• msg è una stringa che verrà mostrata in una finestra
Non è necessario specificare l’oggetto window– window.alert(msg)
Non si può usare HTML all’interno di msg per formattare il testo, ma solo caratteri ASCII e \n, \t, …
Tecnologie di Sviluppo per il WEB 30
Esempio<BODY> <SCRIPT type="text/javascript"><!--alert("ciao mondo\n");//--></SCRIPT> </BODY>
Tecnologie di Sviluppo per il WEB 31
confirm
Mostra una finestra di dialogo contenente un messaggio e due bottoni uno per confermare l’azione l’altro per annullare l’azione
Sintassi– confirm(msg)– Restituisce true se l’utente preme OK false
altrimenti
Tecnologie di Sviluppo per il WEB 32
Esempio<SCRIPT type="text/javascript"><!--if(confirm("premi OK per continuare"))
document.write("<H1>Hai premuto OK</H1>");else
document.write("<H1>Hai premuto Annulla</H1>");//--> </SCRIPT>
esempio
Tecnologie di Sviluppo per il WEB 33
prompt
Mostra una finestra di dialogo con un messaggio, una linea testuale di input e due bottoni uno per confermare l’azione l’altro per annullare l’azione
Sintassi– prompt(msg,default)
• msg è il messaggio mostrato all’utente• default è l’input di default, usare “” per creare
una linea testuale di input vuota
Restituisce la stringa digitata dall’utente
Tecnologie di Sviluppo per il WEB 34
Esempio
<SCRIPT type="text/javascript"><!-- val=prompt("Come ti chiami?",
"ambrogio")document.write("<H1>Ciao
"+val+"</H1>");//--> </SCRIPT>
esempio
Tecnologie di Sviluppo per il WEB 35
Metodi bloccanti e non
I metodi prompt e confirm sono bloccanti– Lo script interrompe la sua esecuzione ed
aspetta un’azione dell’utente (chiude la finestra di dialogo, inserisce un input,…)
– Il resto della pagina HTML non viene visualizzato
Il metodo alert non è bloccante– È vero per sistemi Unix-like ma non per
Windows, anche alert è bloccante
Tecnologie di Sviluppo per il WEB 36
Input di numeri
Il valore restituito da prompt (e.g., val) è di tipo stringa
Per convertirlo al tipo intero usiamo la funzione parseInt(val)
Per convertirlo al tipo float usiamo la funzione parseFloat(val)
Entrambi restituiscono NaN se val non inizia per un numero (Not A Number)– NaN costante indicante che non si tratta di
un numero
Javascript – 2
Elementi del linguaggio
Tecnologie di Sviluppo per il WEB 38
Cosa c’è in Javascript Gli elementi 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• raggruppamenti di dati e funzioni
Tecnologie di Sviluppo per il WEB 39
Commenti in Javascript
Stessa tecnica del C++ o di Java Commenti su di una singola linea
//
Commenti su più lineeInizio commento /*Fine commento */
Tecnologie di Sviluppo per il WEB 40
Punto e virgola opzionale
Ogni istruzione dovrebbe terminare con il punto e virgola (;)
Può essere omesso se due istruzioni sono separate da un carriage-returna = 3 b = 4
Nel seguente caso è obbligatorioa = 3; b = 4;
Conviene sempre metterlo
Tecnologie di Sviluppo per il WEB 41
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)
Tecnologie di Sviluppo per il WEB 42
Letterali Il letterale è usato per rappresentare un
valore fissato che compare all’interno di un programma JavaScript (letteralmente)
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– Maggiori dettagli in seguito
Tecnologie di Sviluppo per il WEB 43
Valori
Javascript riconosce i seguenti tipi di valori– Numeri– Valori booleani– Stringhe– null //può essere assegnato ad una variabile
• Indica un valore nullo
– undefined• Indica che una variabile ha un valore indefinito
– Sebbene null e undefined siano leggermente differenti, l'operatore == (uguale) li considera uguali e l'operatore === (identità) no.
Tecnologie di Sviluppo per il WEB 44
Numeri interi
decimali: (compresi tra –253 e 253)– e.g., 77 – 9876453
ottali (iniziano con zero):– e.g., 077 – 09876
esadecimali (iniziano con 0x o 0X):– e.g., 0x77 – 0X123456789abcDEF
Tecnologie di Sviluppo per il WEB 45
Numeri in virgola mobile
Notazione standard– 1234.567 – -1.234
Notazione scientifica– 1.2345e10 1.1234e-11 9. 87E-21
Valore massimo ±1.7976931348623157x10308
Valore minimo ±5x10-324
Tecnologie di Sviluppo per il WEB 46
Costanti numeriche speciali Infinity* oppure Number.POSITIVE_INFINITY
– Valore speciale per rappresentare “infinito”
NaN 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”
Tecnologie di Sviluppo per il WEB 47
Valori booleani
Possono assumere il valore true o false JavaScript, se è necessario, converte
true in 1 e false in 0
Tecnologie di Sviluppo per il WEB 48
Valori stringa
Sono letterali di zero o più caratteri racchiusi tra virgolette doppie (") o singole (')
Tecnologie di Sviluppo per il WEB 49
Caratteri speciali
Oltre ai caratteri ordinari o a quelli espressi in UNICODE (\uXXX, dove X è un valore esadecimale), si possono inserire nelle stringhe i seguenti caratteri speciali– \' (apice singolo) \" (apice doppio)– \b (backspace) \f (form feed) – \n (interruzione di linea) \r (ritorno carrello) – \t (tabulazione) \\ (backslash)– \v (tab. verticale) \0 (carattere NUL)
Tecnologie di Sviluppo per il WEB 50
Parole riservate – 1o abstracto booleano breako byteo caseo catcho charo classo consto continueo debuggero default
o deleteo doo doubleo elseo enumo exporto extendso falseo finalo finallyo floato for
o functiono gotoo ifo implementso importo ino instanceofo into interfaceo longo nativeo new
Tecnologie di Sviluppo per il WEB 51
Parole riservate – 2
o nullo packageo privateo protectedo publico returno shorto statico supero switcho synchronizedo this
o throwo throwso transiento trueo tryo typeofo varo voido volatileo whileo with
Tecnologie di Sviluppo per il WEB 52
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 ≠ var1
Tecnologie di Sviluppo per il WEB 53
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);document.write(“<BR>”);altezza=“5.4 metri”;document.write(altezza);// --> </SCRIPT>
ESEMPIO
Tecnologie di Sviluppo per il WEB 54
Dichiarazione di variabili – 1
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!";
Tecnologie di Sviluppo per il WEB 55
Dichiarazione di variabili – 2 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
Tecnologie di Sviluppo per il WEB 56
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 inizializzata otteniamo un errore al tempo di runtime
Tecnologie di Sviluppo per il WEB 57
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)– Verrà introdotto, per il momento lo
supporta solo FF
Tecnologie di Sviluppo per il WEB 58
Cenni su oggetti in Javascript – 1 Un oggetto in JavaScript è una collezione di
valori con nome (named values)– Una specie di struttura in C
In genere si fa riferimento a questi named values con il nome di proprietà
Per far riferimento ad una proprietà di un oggetto si fa riferimento al nome dell’oggetto seguito dal punto (.) e dal nome della proprietà – immagine.altezza– immagine.larghezza
Tecnologie di Sviluppo per il WEB 59
Cenni su oggetti in Javascript – 2
Se un oggetto contiene una funzione, allora la funzione prende il nome di metodo dell’oggetto ed il nome della proprietà diventa il nome del metodo
Una variabile è fondamentalmente la stessa cosa di una proprietà di un oggetto
Maggiori dettagli sugli oggetti in seguito
Tecnologie di Sviluppo per il WEB 60
L’oggetto globale – 1 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
Tecnologie di Sviluppo per il WEB 61
L’oggetto globale – 2 Per far riferimento a questo oggetto in
porzioni di codice JavaScript che non fanno parte di funzioni, possiamo usare la parola chiave this– All’interno di funzioni, this ha un significato
differente, dettagli in seguito In JavaScript lato client l’oggetto Window
serve da oggetto globale
Tecnologie di Sviluppo per il WEB 62
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
Tecnologie di Sviluppo per il WEB 63
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)
Espressioni ed operatori
Tecnologie di Sviluppo per il WEB 65
Espressione – 1 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)
Tecnologie di Sviluppo per il WEB 66
Espressione – 2
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
Tecnologie di Sviluppo per il WEB 67
Tipi di operatori
Unario– L’operatore ha un solo operando– E.g., -3
Binario– L’operatore ha due operandi– E.g., 3+4
Ternario– L’operatore ha tre operandi– E.g., a < 4 ? 3 : 4;
Tecnologie di Sviluppo per il WEB 68
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
Tecnologie di Sviluppo per il WEB 69
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 instanceof x vero se y èun’istanza
della classe x
Tecnologie di Sviluppo per il WEB 70
Esempio di in ed instanceof
var theDay=new Date(2008, 11, 13)if (theDay instanceof Date) { // istruzioni da eseguire}
var point = {x:1, y:1}; //oggettoif (“x” in point) { // istruzioni da eseguire}
Tecnologie di Sviluppo per il WEB 71
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
Tecnologie di Sviluppo per il WEB 72
Operatori di disuguaglianza
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
Tecnologie di Sviluppo per il WEB 73
Operatori su stringhe
Tutti gli operatori di relazione già visti + concatenazione "Ciao a voi " + 3; => "Ciao a voi 3" L’operatore + usato con stringhe e
numeri associa a sinistra 1 + 2 + "gattini"; produce "3 gattini" (("gattini:" + 1) + 2); produce "gattini: 12"
Tecnologie di Sviluppo per il WEB 74
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"
Tecnologie di Sviluppo per il WEB 75
Operatori logici && AND logico
– expr1 && expr2 || OR logico
– expr1 || expr2 ! NOT logico
– !expr Le espressioni logiche vengono valutate da
sinistra verso destra; l’interpretazione si arresta appena diventa noto il valore dell’espressione (corto circuitata)– 7 < 10 || “espressione” “espressione” non verrà
mai valutata
Tecnologie di Sviluppo per il WEB 76
Operatori bitwise Lavorano sui bit che rappresentano i loro
operandi
& AND bitwise | OR bitwise ^ XOR bitwise ~ NOT bitwise << shift verso sinistra (x << 3;) >> shift verso destra (x >> 4;) >>> shift verso destra con
riempimento di 0
Tecnologie di Sviluppo per il WEB 77
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;
Tecnologie di Sviluppo per il WEB 78
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
Tecnologie di Sviluppo per il WEB 79
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
Tecnologie di Sviluppo per il WEB 80
Operatore typeof
L’operatore typeof restituisce una stringa che indica il tipo dell’operando
Sintassi– typeof operando– typeof (operando)
Esempio if(typeof a == “string”)
document.write(a +“ è una stringa”);
Tecnologie di Sviluppo per il WEB 81
Esempi di typeof
typeof parseInt – restituisce la stringa “function”
typeof undefinedVariable – restituisce “undefined”
typeof 33 restituisce “number” typeof “Ciao” restituisce “string” typeof true restituisce “boolean” typeof null restituisce “object”
Tecnologie di Sviluppo per il WEB 82
Operatore void
L’operatore void specifica un’espressione che deve essere valutata senza restituire un valore
Sintassi– void espressione– void (espressione)
Tecnologie di Sviluppo per il WEB 83
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, ….)
esempio
Tecnologie di Sviluppo per il WEB 84
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
Tecnologie di Sviluppo per il WEB 85
Altri operatori
Li analizzeremo in seguito 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
Istruzioni
Tecnologie di Sviluppo per il WEB 87
Istruzioni JavaScript In JavaScript la più semplice istruzione è
un’espressione che ha un effetto collaterale– s = 4 + i;– 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);
}
Tecnologie di Sviluppo per il WEB 88
Istruzioni condizionali Un’istruzione condizionale è un insieme di
comandi che vengono eseguiti se una condizione specificata è vera
if– if (espressione) istruzioni
if else– if (espressione) istruzioni1 else istruzioni2
if else if– if (espressione1) istruzioni1
else if (espressione2) istruzioni2 else istruzioni3
Tecnologie di Sviluppo per il WEB 89
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
Tecnologie di Sviluppo per il WEB 90
Sintassi
switch (espressione){ case label1 : istruzione1; break; case label2 : istruzione2; break; ... default : istruzione;}
Può essere:
case 60*60*24: case Math.PI: case n+1: case a[0]:
Tecnologie di Sviluppo per il WEB 91
Esempioswitch (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>");}
Tecnologie di Sviluppo per il WEB 92
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
Tecnologie di Sviluppo per il WEB 93
Ciclo for
Sintassifor(assegnamento; condizione; incremento)
istruzioniEsempi
for(count = 0; count < 10; count++) document.write(count + "<br>");
for(i = 0, j = 10 ; i < 10 ; i++, j--) sum += i * j;
opzionali
Tecnologie di Sviluppo per il WEB 94
Ciclo while
Sintassiwhile (condizione) {
istruzioni}
Esempio var count = 0; while (count < 10) {
document.write(count + "<br>"); count++;
}
Tecnologie di Sviluppo per il WEB 95
Ciclo do while
Sintassido {
istruzione} while (condizione );
Esempiovar i=0;do {
i+=1; document.write(i);} while (i<5);
Tecnologie di Sviluppo per il WEB 96
Ciclo for in
Sintassifor (variable in object)
statement Esempiofor (prop in my_object) {
nome= "Nome: " + prop; valore= "Valore: " + my_object[prop];document.write(nome + " - " +valore+ "<br>");
}
Tecnologie di Sviluppo per il WEB 97
label Con una label possiamo fornire un
identificativo ad un’istruzione. È usata in cicli annidati in concomitanza con break o continue
Sintassilabel:
istruzione EsempiomarkLoop:
while (theMark == true) doSomething();}
Tecnologie di Sviluppo per il WEB 98
break Con break forziamo l’uscita dal ciclo più
interno che lo racchiude o da uno switch Sintassi
break oppurebreak label;
Esempio
for(i = 0; i < a.length; i++) { if (a[i] == target)
break; }
Tecnologie di Sviluppo per il WEB 99
continue È usato solo all’interno di un ciclo, interrompe il ciclo
e va a controllare la condizione Sintassi
continue oppurecontinue label;
Esempioi = 0; n = 0;while (i < 5) { i++; if (i == 3) continue; n += i;}
Tecnologie di Sviluppo per il WEB 100
Esempio di continue con labelcheckIandJ :
for (i=0; i<4, i++) { document.write(i + "<BR>"); checkJ : for (j=10; j>4; j--) { document.write(j + "<BR>"); if ((j%2)==0) continue checkIandJ; document.write(j + " is odd.<BR>"); } document.write("i = " + i + "<br>"); document.write("j = " + j + "<br>"); }
Tecnologie di Sviluppo per il WEB 101
Istruzione with
L’istruzione with stabilisce l’oggetto di default per un insieme di istruzioni
Sintassiwith (oggetto){
istruzioni }
Per identificativo che compare in istruzioni si verifica se è una proprietà di oggetto
L’uso di with rallenta l’esecuzione
Tecnologie di Sviluppo per il WEB 102
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);
}
Tecnologie di Sviluppo per il WEB 103
Istruzioni non ancora esaminate
function– Definizione di funzioni
throw– Generazione di un’eccezione
try/catch/finally– Meccanismo di gestione delle eccezioni
top related