img

Guida agli "Array e Funzioni"

7.Array

I numeri, le stringhe, e i valori booleani sono utili per memorizzare SINGOLI DATI, ma spesso occorre lavorare su interi GRUPPI DI VALORI, come per esempio Elenchi o Serie di numeri, in cui le singole variabili risultano del tutto inadatte.

Gli Array risolvono questo problema offrendo una struttura ordinata per la memorizzazzione di gruppi di valori.
Si può considerare un array come una sorta di casellario dove, in ciascuna casella,
é possibile memorizzare un valore, contraddistinto da un indice che ne caratterizza la sua collocazione;

In altrin termini, per ogni elemento memorizzato, esiste un indice che lo individua.


L'immagine che segue raffigura quanto appena detto

immagine array


Gli Array dal punto di vista delle proprietà e dei metodi, li vredremo tra poco quando studieremo gli OGGETTI.è un insieme ordinato di valori, cui riferirsi con il suo nome e con il relativo indice posto tra parentesi quadre.

Per costruire un nuovo array vi sono tre modi:

       
var mioarray= new Array()
      crea un array vuoto di grandezza indefinita
      
var mioarray= new Array(dimensione)
      crea un array di grandezza dimensione,
      che deve essere uguale al numero di
      elementi + 1 (ma partendo da zero).
      Quindi dimensione sarà un numero uguale
      al numero reale degli elementi.
      
var mioarray= new Array(elemento_1, elemento_2, elemento_3)
      crea un array i cui elementi assumono
      direttamente i valori dei parametri 
      passati (e separati tra loro da virgole).
      La grandezza dell’array è data dal 
      numero degli elementi creati.
 
Esempio:

var nomi = new Array(3)
 //abbiamo creato un Array con dimenzione 3

Possiamo far riferimento ad un elemento
particolare di un array utilizzando un indice.
Il primo elemento dell’array è 0.

Scriviamo i valori degli elementi nell'Array
nomi[0] = "Pippo"
nomi[1] = "Pluto"
nomi[2] = "Paperino"

alert(nomi[1])
//otteniamo in uscita Pluto 

7a. Array Associativi

Gli Array normali
associano un indice al valore dell'elemento e questo permette di immagazzinare una grande mole di dati perchè l'indice, numerico e progressivo permette un riempimento automatico dell'array ma di contro, non fornisce nessuna informazione sul valore dell'elemento.

Gli Array Associativi
consentono di aggirare questo tipo di problema in quanto permettono di specificare coppie chiave-valore, invece di utilizzare come indice dei numeri, utilizzano delle stringhe.


Esempio:

var arrayCapitali = [];
arrayCapitali["Italia"] = Roma;
arrayCapitali["Francia"] = Parigi;
arrayCapitali["Spagna"] = Madrid;
arrayCapitali["Grecia"] = Atene;

Dopo aver creato questo Array è molto facile risalire  

dalla chiave ["Francia"] 

al suo valore  Parigi.  
  
  

L'immagine che segue raffigura quanto appena detto

immagine array

In sostanza ogni volta che abbiamo bisogno di dare un nome significativo a uno dei due parametri dell'array useremo gli array Associativi con Chiave-Valore, anzichè Indice-Elemento; ad Esempio: TitoloLLibro-ISBN, NomeCitta-CodicePostale, Nazioni-Capitali ecc...

Gli Array dal punto di vista delle proprietà e dei metodi, li vredremo tra poco quando esamineremo gli OGGETTI.

8.Funzioni

Facendo il punto delle cose studiate fino ad ora, possiamo SINTETIZZARLE così: Abbiamo visto alcune regole che stabiliscono il modo corretto di come scrivere le istruzioni; I tipi di dati e gli operatori che permettono di scrivere le istruzioni;

Espressioni per le istruzioni SEQUENZIALI e le Strutture di controllo SELETTIVE E ITERATIVE. Ora siamo difronte a un nuovo tipo: istruzioni a STRUTTURA MODULARE, perchè?

Le istruzioni di tutto codice JavaScript presentato finora, viene eseguito non appena la pagina viene caricata nel browser.

Il codice viene eseguito dall'inizio alla fine e poi termina senza essere più eseguito, e se si ha bisogno di ripetere le stesse operazioni in un punto diverso della pagina, si deve riscrivere tutto da capo.

Ed é quì che entrano in gioco le funzioni:

Le funzioni sono come piccoli pacchetti di codice JavaScript che per essere eseguite attendono solo di essere richiamate, oppure eseguite in relazione ad un evento.

Una funzione è in insieme di istruzioni.

Si possono riutilizzare nello stesso script o in altri documenti. Si può definire una funzione all’inizio del file per poi utilizzarla da un’altra parte nel documento.

Per creare una funzione occorre definire (dopo la parola chiave function)
il nome,
gli argomenti,
e le istruzioni


Esempio

function nomeFunzione(argomento1, argomento2, etc){
    ...   istruzioni   ...
  }

Una funzione senza argomenti, deve comunque includere le parentesi tonde:

function nomeFunzione(){
    istruzioni;
  }

1. Gli argomenti sono delle variabili
utilizzate nella funzione.

2. I valori delle variabili
sono i valori passati quando si richiama la funzione.

3. Le funzioni che restituiscono un valore
devono includere l’istruzione "return".

4. Questa istruzione specifica il valore
che verrà restituito quando la funzione sarà chiamata.

5. Una funzione NON VIENE ESEGUITA
prima di essere chiamata.

6. Si può chiamare una funzione passandogli o meno
degli argomenti:

Esempio

function funzioneProdotto(a, b){
    risultato = a*b;
    return risultato;
  }

RICHIAMARE LA FUNZIONE:

miaVariabile = funzioneProdotto(4, 5)

miaVariabile
conterrà il valore del risultato ritornato:
in questo caso 20
e potrà essere utilizzato in seguito nello script.

    

APPROFONDIMENTO SULLE Funzioni

Una funzione è un blocco di istruzioni che svolge un compito specifico e che può essere utilizzato più volte all’interno del programma. Definizione di una funzione. function nome_funzione (parametro_01, ..., parametro_0n) { variabili istruzioni [return] }
Dopo che una funzione è stata definita per utilizzarla (invocarla, chiamarla),
occorre semplicemente scrivere il suo nome seguito da una coppia di parentesi tonde
al cui interno porre gli eventuali argomenti richiesti.

Analizzando la Sintassi notiamo che una funzione si definisce prima di tutto, utilizzando la parola chiave function, cui segue il suo nome,

e poi tra una coppia di parentesi tonde, si pongono i cosiddetti parametri formali, ovvero delle variabili che conterranno i valori passati all’atto dell’invocazione della funzione, definiti come parametri attuali o argomenti.

Infine si ha un blocco di codice delimitato dalle parentesi graffe, al cui interno saranno scritte le istruzioni che la funzione elaborerà e un’eventuale parola chiave return utilizzabile per ritornare al chiamante della funzione un valore.

Se la parola chiave return
è omessa la funzione ritornerà il valore undefined(non definito).


AMBITO DI VALIDITÀ DI UNA VARIABILE

Le variabili interne ad una funzione devono essere create con l’istruzione var. Le variabili possono essere

globali create fuori da una funzione. Le variabili globali sono disponibili in tutto il documento. È buona norma di programmazione crearle all’inizio, prima di ogni altra istruzione.

locali sono le variabili la cui validità è limitata all’interno della funzione entro la quale sono definite. Cessa di esistere nel momento in cui la funzione ha raggiunto la parentesi graffa inferiore. Non sono accessibili fuori dalla funzione in cui sono state create. Una variabile globale può essere usata all’interno di una funzione.

Argomenti passati alla Funzione
Gli argomenti sono passati alla funzione come una lista di espressioni valide separate da virgole. Si ricordi che, anche se la funzione non ha parametri, è comunque necessario specificare le due parentesi tonde dopo il nome. È possibile omettere uno o più parametri al termine della lista degli argomenti.

Passaggio di Parametri
Il passaggio dei parametri alle funzioni Javascript avviene in maniera diversa a seconda del tipo del parametro stesso:
I tipi booleano, stringa, numero e null sono passati per valore.
Nella funzione, cioè, è presente una copia del valore usato come argomento.
Cambiamenti locali alla funzione non influenzano il valore dell'argomento usato nella chiamata alla funzione stessa.
Il tipo oggetto è passato per riferimento.
La manipolazione del contenuto dell'oggetto all'interno della funzione si riflette sull'oggetto usato come argomento.

Ritorno
Le funzioni restituiscono il controllo al chiamante al termine del loro blocco di istruzioni.
È possibile restituire un valore al chiamante, utilizzando la consueta parola chiave
return
seguita da un'espressione valida.
Se la funzione non esegue alcun return,
Javascript sottintende un "return undefined" implicito.


9.Try Catch

Javascript fornisce uno strumento per la gestione delle eccezioni che possono scaturire da eventuali errori del codice e dar luogo a un comportamento non desiderato ed imprevisto del nostro programma.

Le cause possono essere moltecipli, come ad esempio, un riferimento ad un oggetto che non esiste;

in pratica ogni volta che non abbiamo la certezza che una variabile sia valorizzata correttamente, perche magari non dipende dal codice scritto da noi ma da un elemento gestito dal client, e quindi potrebbe avere un nome diverso nei vari browser, dobbiamo intervenire affinche il programma non si blocchi ed invii uno sgradevole messaggio d'ERRORE.

Lo strumento é costituito dal blocco try/catch fornito da JavaScript per lo scopo sopra descritto.

Vediamo come funziona:

  try {
    // codice che può generare un errore
    // (e quindi un'eccezione)
  }
  catch(e) {
    // codice che viene eseguito solo se
    // é stata sollevata una eccezione nel blocco try 
    // i dettagli dell'eccezione(un messaggio d'errore)
    // sono disponibili nel parametro (e)  
  }


L'immagine che segue raffigura quanto appena detto


immagine if


ANALISI: Noi inseriamo il codice che può generare errori nel blocco try.
Se l'errore si verifica, l'esecuzione viene passata immediatamente al blocco catch
e se l'eccezione non viene gestita, l'errore si propaga
e prosegue fino in cima allo stack delle chiamate del programma.

Se invece non avvengono errori all'interno del blocco try,
allora il codice nel blocco catch non viene mai eseguito.

Esempio PRATICO:

// vogliamo creare una istanza dell'oggetto XMLHttpRequest
function creaOggettoXmlHttpRequest() 
{
  // memorizza il riferimento all'oggetto XMLHttpRequest
  var xmlHttp;
  try {
    // tentiamo di creare un oggetto XMLHttpRequest
    xmlHttp = new XMLHttpRequest();
  }
  catch(e) {
    // NON gestiamo l'eccezione e ignoriamo il messaggio d'errore;
    // perchè ne creiamo uno nostro e 
    // lo gestiamo con l'istruzione if che segue
  }
  // restituisce l'oggetto creato o mostra un messaggio d'errore
  if (!xmlHttp)
    alert("Errore durante la creazione dell'oggetto XMLHttpRequest.");
  else 
    return xmlHttp;
}