26.3 tableaux associatifs
copyleftSee You Why?
26.3 tableaux associatifs |
| copyleft See You Why? |
Jusqu'ici, on aura retenu qu'un tableau est une sorte particulière de variables, qui ne contient pas qu'une seule valeur comme le font les variables, mais qui peut en contenir plusieurs.
Pour retenir chacun des éléments d'un tableau, il faut utiliser des indices numériques, lesquels commencent à 'zéro'.
Un tableau de dimension 1, aura un indice unique. Les tableaux de dimension 2 auront deux indices. Ceux de dimension 3 auront trois indices, etc.
Que sont alors les tableaux associatifs ? Une réponse rapide pourrait être "qu’un tableau associatif
n’utilise pas la méthode numérique pour indexer les différents éléments, mais des noms".
Leur construction est alors plus proche de la construction des objets (voir "jvs_240_objet_propre.html").
Mais un exemple peut être plus parlant que de lourdes explications.
Pour retenir les propriétés d'un pays de la CE, pour le déclarer et l'affecter de valeurs, il fallait écrire :
var pays_ce=[Allemagne,Berlin,81471834,357026,DE]
et si l'on savait que le nom était la première propriété, il fallait écrire, par exemple :
document.write(pays_ce[0]);
Et, comme les tableaux associatifs n'ont pas d'indices numériques, on aurait pu écrire :
document.write(pays_ce["nom"]);
Cela semble en effet beaucoup plus facile, mais alors il eut fallu faire la déclaration et l'affectation de ce tableau associatif de la manière suivante (si l'on voulait rester proche de la construction classique des tableaux) :
var pays_ce = new ArrayObject; //c'est bien un objet, et non plus un Array
pays_ce["nom"] = "Allemagne";
pays_ce["capitale"] = "Berlin";
pays_ce["population"] = 81471834;
pays_ce["surface"] = 357026;
pays_ce["sigle2"] = "DE";
Et si l'on voulait rester fidèle à la construction des objets, on aurait pu faire cette déclaration et assignation de la manière suivante :
var pays_ce = { "nom" : "Allemagne", "capitale" : "Berlin", "population": 81471834, "surface":
357026, "sigle2": "DE"};
ou
var x = { "un" : 1, "deux" : 2, "trois": 3 };
ATTENTION :
for(var val_contenu in pays_ce){
document.write(val_contenu + ' : ' + pays_ce[val_contenu] + '<br>');
}Un autre exemple de tableau associatif : le rectangle déterminé par les mesures de sa longueur et celle de sa largeur. On pourrait écrire :
var rectangle = new Array;
rectangle = {longueur:12,largeur:5};
Et, il pourrait être possible d'ajouter un élément ou plusieurs éléments (en plus de la longueur et la largeur) et notre rectangle, initialement à 2 propriétés deviendrait un objet à 4 propriétés, il suffirait d'écrire :
rectangle["aire"]=rectangle["longueur"]*rectangle["largeur"];
rectangle["perimetre"]=2*(rectangle["longueur"]+rectangle["largeur"]);
Mais si le lecteur a bien lu notre chapitre 24, relatif aux objets, il préfèrera probablement
la notation propre aux objets, à savoir : rectangle.longueur ou rectangle.largeur qui nous semble
alors plus facile et légère à utiliser.
OK pour les tableaux associatifs de dimension 1.
Mais qu'en est-il des tableaux associatifs de dimension 2 ?
Comme un tableau de dimension 2 n'est rien d'autre
qu'un tableau (de dimension 1) de tableaux (de dimension 1)
il suffit de déclarer un tableau de dimension n, puis n tableaux de dimension p.
Reprenons les élèves de la classe '3rse' :
Créons un tableau associatif de l'ensemble des élèves de la façon suivante :
var el_3rse = ["ElifS","FredD","KathiaN","LaetitiaH","MelanieA","SihamF"];
Remarquons que jusqu'ici, ce tableau de dimension 1, n'a rien d'un tableau associatif... ce peut être un tableau à indice numérique...
Il reste alors à créer 6 tableaux associatifs pour les propriétés retenues. On écrira :
var el_3rse["ElifS"] = {Nom:"Sari",Prenom:"Elif",Taille:1.62,Poids:54,Age:16};
var el_3rse["FredD"] = {Nom:"Delier",Prenom:"Frédéric",Taille:1.82,Poids:78,Age:18};
var el_3rse["KathiaN"] = {Nom:"Noussis",Prenom:"Kathia",Taille:1.59,Poids:52,Age:17};
var el_3rse["LaetitiaH"] = {Nom:"Hubrecht",Prenom:"Laetitia",Taille:1.70,Poids:66,Age:15};
var el_3rse["MelanieA"] = {Nom:"Alard",Prenom:"Mélanie",Taille:1.72,Poids:63,Age:14};
var el_3rse["SihamF"] = {Nom:"Farris",Prenom:"Siham",Taille:1.71,Poids:70,Age:19};
Et voilà notre tableau associatif de dimension 2 déclaré et affecté de valeurs. Le lecteur remarquera que les valeurs introduites peuvent être des chaines de caractères, des valeurs entières ou des valeurs décimales. On pourrait même introduire des données qui soient elles-mêmes des tableaux de dimension variable... mais laissons ça à ceux qui veulent devenir des champions de la programmation JS.
Dans un tableau associatif, l'accès aux données ne peut se faire par des indices numériques... il existe cependant une boucle
particulière qui permet de parcourir ces tableaux associatifs... for ... in ... ou foreach ... in ... mais que tout navigateur
n'accepte pas.
Ainsi, pour un tableau associatif de dimension 1, si l'on veut avoir la liste des élèves de notre classe de 3rse, on pourrait écrire :
for (eleve in el_3rse) {
document.write("l'eleve dont le sigle est "+ el_3rse[eleve] + " est en 3e.");
}
Le lecteur attentif aura cependant remarqué que l'exemple ci-dessus n'est pas un tableau associatif, mais un tableau à indice numérique... juste une petite question... l'aviez-vous remarqué ?
Construisons donc un vrai tableau associatif de dimension 1 : les adresses mails (fictives) de nos élèves, par exemple :
var ad_mail=new Array();
ad_mail['ElifS']='[email protected]';
ad_mail['FredD']='[email protected]';
ad_mail['KathiaN']='[email protected]';
ad_mail['LaetitiaH']='[email protected]';
ad_mail['MelanieA']='[email protected]';
ad_mail['SihamF']='[email protected]';
Et maintenant, pour voir l'adresse mail de Kathia, j'écrirai :
document.write("L'adresse mail de Kathia est "+ad_mail['KathiaN']+ ".");
Et pour obtenir la liste de toutes les adresses, j'emploierai la fameuse boucle :
for (elev in ad_mail) {
document.write("le mail de l'eleve de sigle "+ elev + " est " + ad_mail[elev]);
}
Et si Siham change d'adresse, il me suffira d'écrire :
ad_mail['SihamF']='[email protected]';
mais on pourrait aussi préférer la notation propre aux objets, à savoir :
ad_mail.SihamF='[email protected]';
Revenons-en à un tableau de dimension 2... nous ne pouvons que conseiller de déclarer (sans affecter) un premier tableau qui ne soit pas associatif, mais à indice numérique... qui ne soit que de dimension 1, sans autre contenu ; il suffira de le déclarer ainsi :
var el_3rse=new Array();
puis, nous vous proposons de déclarer et affecter chacun des (sous-)tableaux relatifs à chaque élève... on aura alors :
el_3rse[0] = new Array();
el_3rse[0]["sigle"] = "ElifS";
el_3rse[0]["nom"] = "Sari";
el_3rse[0]["prenom"] = "Elif";
el_3rse[0]["age"] = 16;
el_3rse[0]["taille"] = 1.62;
el_3rse[0]["poids"]= 54;
pour la 1re étudiante, etc. pour les suivants (d'indice 1 à 5... puisqu'il y a 6 élèves). Et pour faire la liste de
ces élèves et de leurs propriétés encodées, notre bouccle for... in... devra faire l'affaire :
for (var i=0;i<el_3rse.length;i++) {
document.write("<dl><dt>el_3rse n° "+(i+1)+"<\/dt>");
for (var propriete in el_3rse[i]) {
document.write("<dd>"+ propriete + ": "+el_3rse[i][propriete]+"<\/dd>");
}
document.write("<\/dl>");
}
Vous voulez tester ? Essayez.
Exemple
|
el_3rse[0] = new Array();
el_3rse[0]["sigle"] = "ElifS";
el_3rse[0]["nom"] = "Sari";
el_3rse[0]["prenom"] = "Elif";
el_3rse[0]["age"] = 16;
el_3rse[0]["taille"] = 1.62;
el_3rse[0]["poids"]= 54;
el_3rse[0] = new Array();
el_3rse[0]["sigle"] = "ElifS";
el_3rse[0]["nom"] = "Sari";
el_3rse[0]["prenom"] = "Elif";
el_3rse[0]["age"] = 16;
el_3rse[0]["taille"] = 1.62;
el_3rse[0]["poids"]= 54;
foreach($personnes as $cle1 => $valeur1)
{
echo "personne n°:" . $cle1 . "<br />";
foreach ($valeur1 as $cle2=>$valeur2)
{
echo "Clé : ".$cle2 .", Valeur: " . $valeur2 . "<br />\n";
}
}
voir suite >>>
voir suite >>>