Manipolazione dei dati

Oggetto e Tipi

  • L’oggetto è una grandezza informatica in grado di rappresentare i dati.
  • Nella programmazione OOP tutte i dati si rappresentano e si elaborano tramite oggetti.
  • Quando scrivo:
pippo = new Date();
  • o:
pippo = ″Ciao gente!″;
  • non assegno semplicemente un valore a una variabile. Creo un dato complesso detto oggetto che oltre al valore contiene tutti gli strumenti necessari ad elaborarlo.
  • Nella programmazione OOP i tipi di oggetto (il tipo è, in generale, determinato dal tipo di dati che l’oggetto è destinato ad elaborare) si chiamano classi.
  • La classe, cioè, è l’insieme di regole che determinano come funziona un oggetto di una determinato tipo (o, i termini OOP, un istanza di una determinata classe).
  • In Javascript non si fa menzione espressa del temine class (che per altro è una parola riservata che non può essere usata dall’utente). Per noi quindi oggetto (inteso come tipo di oggetto) e classe saranno sinonimi.
  • Esistono oggetti (classi) predefinite dal linguaggio, oggetti (classi) create dalla comunità dei programmatori e che posso caricare e utilizzare nelle mie pagine Web e, infine, noi stessi possiamo creare le nostre classi per risolvere i nostri problemi.

Proprietà e Metodi

Ogni tipo di dato (classe) è caratterizzato da:

  • Proprietà che ci consentono di leggere o modificare determinate caratteristiche di un individuo della classe
  • Metodi che ci mettono a disposizione determinate azioni che gli oggetti possono compiere o subire

Le proprietà contengono un valore (come le variabili) che rappresenta una caratteristica dell'oggetto a cui la proprietà è riferita.

  • Inizializzando una varibile le assegno un tipo (o classe)
pippo = ″Ciao gente!″;
  • E posso accedere alle PROPRIETÀ E AI METODI DEFINITI DA QUEL TIPO.
    • Usando l’operatore di appartenenza ˝•˝
    • Usando le parentesi quadre che racchiudano il nome della proprietà come stringa di caratteri.
// Operatore di appartenenza
var len = pippo.length;

// Parentesi quadre
var len = pippo[″length″];
  • In entrambi i casi len conterrà il numero di caratteri di cui è composta la variabile stringa pippo

Alcune proprietà sono a sola lettura, non possono cioè essere modificate. Se scrivo:

pippo.length = 3;

otterrò un errore perché la proprietà length non può essere modificata.

Mentre se scrivo:

elemento.innerHTML = ″Ciao gente!″;

modificherò il contenuto HTML dell’elemento della pagina elemento (che un elemento HTML definito nella pagina) e le modifiche avranno un immediato effetto sul rendering della pagina stessa.

I metodi contengono codice eseguibile (come le funzioni), e ci consentono di eseguire azioni sull'oggetto.

  • Una volta che una variabile contiene un oggetto
pippo = new Date();
  • Posso accedere ai suoi metodi.
  • Come le funzioni i metodi possono ricevere parametri e ritornare valori. Normalmente quando è previsto il passaggio di parametri i metodi modificano l'oggetto quando restituiscono valore restituiscono informazioni sull'oggetto.
  • Uso l’operatore di appartenenza . e faccio seguire l’identificatore dalle parentesi tonde, l'operatore di esecuzione ()
/*
il metodo getDate restituisce il giorno del mese della data contenuta in pippo che viene memorizzato nella variabile giorno.
*/
var giorno = pippo.getDate();
  • Quando un metodo prevede dei parametri normalmente serve a modificare l'oggetto:
/*
Modifico la data contenuta nella variabile pippo: il giorno del mese sarà 3.
*/
pippo.setDate(3);

Proprietà e Metodi Statici

Esistono metodi e proprietà particolari che non si applicano ai singoli oggetti (istanze de una classe) ma hanno un uso globale.

Per usarli non li applico all’oggetto ma alla classe

/*
La variabile data contiene l’oggetto Date ottenuto convertendo in data la stringa passata come parametro al metodo statico Date.parse
*/
var data = Date.parse("March 21, 2012");

Constructor

È la particolare metodo che consente di creare un oggetto di un particolare tipo (un’istanza di una classe). Può essere:
  • Implicito:
var str = "Ciao!";
  • Esplicito:
var adesso = new Date();
  • Metodo di un altro oggetto:
var elemento = document.createElement("p");

Tipi di base

Number

/* Constructor */
var n = 5;
var n = 10.6;

Proprietà statiche

Proprietà Descrizione
Number.MAX_VALUE; Restituisce il massimo numero consentito in JavaScript
Number.MIN_VALUE; Restituisce il minimo numero consentito in JavaScript
Number.NEGATIVE_INFINITY; Rappresenta l'infinito negativo.
Number.POSITIVE_INFINITY; Rappresenta l'infinito positivo.

 Conversione di Number in String

Metodo Descrizione
toExponential(x) Reastituisce una stringa, che rappresenta il numero come notazione esponenziale dove x (opzionale) indica il numero dei decimali da usare
toFixed(x) Converte il numero in una stringa, con x numero di decimali. Se x non viene specificato nessun decimale.
toPrecision(x) Converte il numero in una stringa di lunghezza x. Se necessario vengono aggiunti punto decimale e 0.
toString(base) Converte il numero in una stringa secondo la base specificata da base. La base di default è 10 (numero decimale). Se base vale 2 si ottiene la rappresentazione binaria del numero, se 16 quella esadecimale, ecc.

Esempi

/*====================================================================
				USO DEI METODI DI NUMBER 
  ==================================================================== */
var num = 1289.2;						         // Numero decimale
var numIntero = 65000;					         // Numero intero
var str;
str = num.toExponential();  				     // "1.2892e+3"
str = num.toExponential(5);  				     // "1.28920e+3"
str = num.toFixed();					         // "1289"
str = num.toFixed(3);					         // "1289.200"
str = num.toPrecision()					         // "1289.2"
str = num.toPrecision(8)					     // "1289.2000"
str = num.toString()					         // "1289.2"
str = numIntero.toString(16)				     // "fde8"
str = numIntero.toString(2)				         // "1111110111101000"
str = num.toString(16)					         // "509.33333333334"

String

/* Constructor */
var str = "Ciao!";

Proprietà

Gli oggetti della classe String hanno una sola proprietà, la proprietà length che restituisce la lunghezza della stringa, cioè il numero di caratteri di cui è composta.

Metodi

Metodo Descrizione
charAt(pos) Restituisce il carattere alla posizione pos
charCodeAt(pos) Restituisce il codice Unicode corrispondente al carattere alla posizione pos
concat(s1, s2) Concatena due stringhe (stesso risultato di s1 + s2)
fromCharCode(code) Restituisce il carattere corrispondente al valore unicode code
indexOf(searchstring, start) Restituisce la posizione della prima occorrenza della stringa searchstring in una stringa (-1 se non lo trova). Opzionalmente la ricerca può partire dalla posizione start. 
lastIndexOf(searchstring, start) Restituisce la posizione dell'ultima occorrenza della stringa searchstring in una stringa (-1 se non lo trova). Opzionalmente la ricerca può partire dalla posizione start in vece che dall'ultimo carattere.
match(regexp) Il metodo match cerca le corrispondenza e tra l'espressione regolare regexp e la stringa, e restituisce un array di corrispondenze. Se non viengono trovate corrispondenze viene restituito null.
replace(regexp/substr, newstring) Replace() cerca una corrispondenza tra una stringa (o un'espressione regolare) e una stringa, e sostituisce la corrispondenze trovate con newstring
charAt(pos) Restituisce il carattere alla posizione pos
charCodeAt(pos) Restituisce il codice Unicode corrispondente al carattere alla posizione pos
concat(s1, s2) Concatena due stringhe (stesso risultato di s1 + s2)
fromCharCode(code) Restituisce il carattere corrispondente al valore unicode code
indexOf(searchstring, start) Restituisce la posizione della prima occorrenza della stringa searchstring in una stringa (-1 se non lo trova). Opzionalmente la ricerca può partire dalla posizione start. 
lastIndexOf(searchstring, start) Restituisce la posizione dell'ultima occorrenza della stringa searchstring in una stringa (-1 se non lo trova). Opzionalmente la ricerca può partire dalla posizione start in vece che dall'ultimo carattere.
match(regexp) Il metodo match cerca le corrispondenza e tra l'espressione regolare regexp e la stringa, e restituisce un array di corrispondenze. Se non viengono trovate corrispondenze viene restituito null.
replace(regexp/substr, newstring) Replace() cerca una corrispondenza tra una stringa (o un'espressione regolare) e una stringa, e sostituisce la corrispondenze trovate con newstring

replace()

  • Il metodo replace () cerca in una stringa i gruppi di caratteri che corrispondono a una substringa o a una regular expression, e restituisce una nuova stringa in cui le occorrenze trovate vengono sostituite da un valore specificato,
  • Nota: Se si usa una substring e non una regular expression per la ricerca,  verrà sostituita solo la prima occorrenza trovata. Per sostituire tutte le occorrenze di una ricerca è necessario usare una regular expression con il modificatore g,
  • Questo metodo non cambia la stringa originale.

split()

  • Il metodo split () viene utilizzato per dividere una stringa in un array di stringhe utilizzanda uno o più caratteri come separatore, e restituisce il nuovo array.
  • Se si utilizza una stringa vuota ("") come separatore, la stringa è diviso nei singoli caratteri che la compongono.
  • Nota: Il metodo split() non modifica la stringa originale.

Esempi 

/*=======================================================================
		       	USO DEI METODI DI STRING 
  ======================================================================= */
var origine = "Ciao gente!";
var origine2 ="Domenica,Lunedì,Martedì,Mercoledì,Giovedì,Venerdì,Sabato";
var str, pos, len, giorni;
len = origine.length;			        // 11
str = origine.charAt(3);			    // "o"
str = origine.indexOf("e"); 		    // 6
str = origine.indexOf("!!");		    // -1 (non trovato)
str = origine.lastIndexOf("e"); 		// 9
str = origine.replace("!", "?");		// "Ciao gente?"
giorni = origine2.split(",");		    // ["Domenica", "Lunedì", "Martedì",						
                                        // "Mercoledì", "Giovedì",
						                // "Venerdì", "Sabato"]
str = origine.substr(5)			        // "gente!"
str = origine.substr(5,2)			    // "ge"

Array

/*  CONSTRUCTOR */
var a = [1,6,78,23];
var a = new Array(1,6,78,23);

Proprietà

Gli oggetti della classe Array hanno una sola proprietà, la proprietà length che restituisce la lunghezza dell'array, cioè il numero di elementi di cui è composto.

Metodi

Metodo Descrizione
concat( array2,array3, arrayX) Unisce uno o più array all'array a cui il metodo è applicato, e restituisce una copia degli array così uniti.
indexOf( elemento, start) Cerca elemento in un array partendo da start (o dall'inizio se start è omesso) e ne restituisce la posizione. Se start è negativo indica la posizione reativa alla fine dell'array.
join(separatore) Unisce gli elementi di un array in una stringa, e restituisce la stringa. Gli elementi sono separati da separatore. Il separatore di default è la virgola .
lastIndexOf(elemento, start) Cerca l'ultima ricorrenza di elemento in un array partendo da start (o dall'iniziose start è omesso) e ne restituisce la posizione o -1 se elemento non viene trovato.
pop() Rimuove l'ultimo elemento di un array, e restituisce  l'elemento rimosso.
push(elemento) Aggiunge elemento alla fine dell'array e restituische la nuova lunghezza.
reverse() Inverte l'ordine degli elementi dell''array.
shift() Rimuove il primo elemento di un array, e restituisce  l'elemento rimosso.
slice( inizio, fine) Estrae gli elementi a partire da inizio, fino a fine, non incluso e li restituisce in un nuovo array. L'array originale non viene modificato.
sort( sortfunct) Ordina gli elementi di un array (alfabetico ascendente) o usa sortfunct per stabilire l'ordine
splice(indice, quanti, item1, itemX) Rimuove quanti elementi dall'array a partire dalla posizine indice e inserisce gli elementi item1,  …., itemX (se forniti) a partire dalla posizine indice. Restituisce gli elementi rimossi.
toString() Restituisce l'array convertito in stringa.
unshift(elemento) Aggiunge elemento all'inizio dell'array e restituische la nuova lunghezza

Esempio dell'uso del metodo sort

/*
	rubrlica è un array di oggetti che hanno due proprietà: nome e cognome.
*/
var rubrica = [
	{nome:"Mario", cognome:"Rossi" },
	{nome:"Luigi", cognome:"Neri" },
	{nome:"Piero", cognome:"Verdi" },
	{nome:"Mario", cognome:"Bianchi" }
];
/* 
	Per ordinare l'array definisco una funzione che stabilisce il criterio
	con cui vengono confrontati gli elemnti dell'array e ritorna un valore 
	positivo se è maggiore il primo elemento, 0 se gli elementi sono uguali 
	e negativo se è maggiore il seondo elemento. 
	La funzione che segue ordina gli elementi in rubrica per cognome in 
	ordine crescente.
*/

var sortCognome = function (a,b){
					  if (a.cognome > b.cognome){
						return 1;
					  } else if (a.cognome == b.cognome){
						return 0;
					  } else {
						return 1;
					  }
			      };
//Ordino l'array secondo il criterio definito dalla funzione sortCognome				  
rubrica.sort(sortCognome);