mercoledì, novembre 19, 2014

Array ed oggetti

Gli array in Javascript sono oggetti particolari.

Come gli oggetti che abbiamo visto fino ad ora, sono una collezione di coppie proprietà valore dove il nome della proprietà è rappresentata da un intero.

Gli array si dichiarano utilizzando le parentesi quadre come in java

 // array senza elementi  
 var array_vuoto = [];  
   
 // array con 10 elementi, separati da virgola  
 // in un array ci posso mettere quel che mi pare, anche funzioni!  
 var numeri = [  
   'zero', 'uno', 'due', 'tre', 'quattro',  
   'cinque', 'sei', 'sette', 'otto', 'nove'  
 ];  
   
 array_vuoto[1] // undefined  
   
 numeri[1] // 'uno'  
   
 array_vuoto.length // 0  
   
 numeri.length // 10  

Consideriamo invece il seguente oggetto json:

 var numeri_object = {  
   '0': 'zero', '1': 'uno', '2': 'due',  
   '3': 'tre', '4': 'quattro', '5': 'cinque',  
   '6': 'sei', '7': 'sette', '8': 'otto',  
   '9': 'nove'  
 };  
   
 numeri_object[1] // uno  
   
 // eccezione, perchè "1" non è un valido identificatore per nomi di proprietà,  
 // quindi siamo obbligati ad usare la notazione ... degli array!  
 numeri_object.1  

Come si può notare, tra oggetto json e array, il risultato è lo stesso.

La differenza sostanziale:

oggetto json eredita da Object.prototype

array eredita da Array.prototype che a sua volta eredita da Object.prototype

Un array dunque, ha a disposizione una serie di metodi e proprietà che sono tipici degli array. come ad esempio la proprietà length.

Forse non ce ne siamo ancora accorti, ma Object e Array sono due funzioni, in particolare due funzioni costruttori


 var array = new Array();   
   
 // equivalente in tutto e per tutto a  
   
 var altroArray = [];  
   
   
 var oggetto = new Oggetto();  
   
 // equivalente in tutto e per tutto a  
   
 var altroOggetto = {};  
   
 // array o altroArray hanno ad es. length, ereditato da Array.prototype  
   
 //oggetto e altroOggetto non hanno la proprietà length
 // perchè ereditano da //Object.prototype  

Al contrario di altri linguaggi come java, non c'è bisogno di specificare la dimensione massima dell'array in fase di dichiarazione, gli array sono dinamici

 var mioArray = [];  
   
 mioArray.length // 0  
   
 mioArray[10] = true;  
   
 mioArray.length // 11  
 // mioArray contiene una proprietà  

E' possibile aggiungere un oggetto come ultimo elemento dell'array con l'istruzione

 var numeri = [1,2,3,4];  
   
 numeri[numeri,length] = 5;  
   
 // [1,2,3,4,5]  

In realtà, tra i metodi di Array.prototype c'è il metodo push che fa la stessa cosa


 numeri.push(6);   // [1,2,3,4,5,6]  

Vi rimando alla documentazione ufficiale per dare un'occhiata ai metodi presenti nel prototipo di ogni oggetto array con relativi esempi

Array.prototype.concat()
Array.prototype.every()
Array.prototype.filter()
Array.prototype.forEach()
Array.prototype.indexOf()
Array.prototype.join()
Array.prototype.lastIndexOf()
Array.prototype.map()
Array.prototype.pop()
Array.prototype.push()
Array.prototype.reduce()
Array.prototype.reduceRight()
Array.prototype.reverse()
Array.prototype.shift()
Array.prototype.slice()
Array.prototype.some()
Array.prototype.sort()
Array.prototype.splice()
Array.prototype.toLocaleString()
Array.prototype.toString()
Array.prototype.unshift()

Giusto per fare un esempio, molto utile il metodo map, che permette di ottenere un nuovo array applicando una funzione, passata come argomento, che trasforma ogni elemento dell'array originale secondo l'implementazione della funzione stessa

 var numeri = [1,2,3,4,5];
   
 var numeri_raddoppiati = numeri.map(function(numero) {return numero * 2;});  
   
 // numeri_raddoppiati [2,4,3,8,10]   

Notate le potenzialità offerte dal linguaggio grazie alla possibilità di passare le funzioni come argomenti.

Ovviamente è possibile iterare un array come lo si fa in java

 var numeri = [1,2,3,4,5];  
   
 var indice;  
   
 for(indice = 0; indice < numeri.length; indice++) {  
    alert('a[' + index + '] = ' + element);  
 }  

Si ottiene lo stesso risultato, più funzionale, nel seguente modo

 numeri.forEach(function(element, index, array) {  
   alert('a[' + index + '] = ' + element);  
 });  

Credo che per oggi basti :)

Alla prox.
Ivan

Nessun commento:

Posta un commento