Tableau associatif en JavaScript

Les tableaux associatifs sont des objets dynamiques que l'utilisateur redéfinit selon ses besoins. Quand on assigne des valeurs à des clés dans une variable de type Array, le tableau se transforme en objet, et il perd les attributs et méthodes de Array. L'attribut length n'est plus disponible car la variable n'a plus le type Array.

Nous allons faire la démonstration de tout cela et aussi montrer comment ajouter une méthode essentielle à un objet pour avoir le nombre d'éléments contenus quand il devient un tableau associatif.

Un tableau associatif est déclaré ou créé dynamiquement

On peut le créer en assignant un littéral à une variable.

var arr = { "un" : 1, "deux" : 2, "trois": 3 };

Contrairement au tableau simple, on utilise des accolades plutôt que des crochets.

On a en fait implicitement créé une variable de type Object.

On accède au contenu par les clés, quelle que soit la méthode de création utilisée pour déclarer le tableau. 

var y = arr["un"];

Un tableau associatif est aussi un objet

Ainsi on peut créer un tableau avec le mot réservé Object.

var o = new Object();
o["un"] = 1;
o["deux"] = 2;
o["trois"] = 3;
for(var i in o)
{
     document.write(i + "=" + o[i] + '<br>');
}

Les attributs d'un objet JavaScript sont aussi des clés

Le propre des objets en JavaScript est que les attributs sont aussi des clés comme on va le vérifier dans la démonstration.
Ainsi, le même tableau peut être créé plus simplement:

var oa = new Object();
oa.un = 1;
oa.deux = 2;
oa.trois = 3;
for(var i in oa)
{
     document.write(i + "=" + x[i] + '<br>');
}

Mais nous devons utiliser la forme d'indice si nous voulons utiliser une variable comme clé...

Rappelons que l'attribut length n'a aucune valeur.

On scanne un tableau associatif avec for in

On ne peut utiliser une simple boucle for car les éléments ne sont pas accessibles par un indice (outre le fait qu'il faut utiliser une fonction spéciale pour connaître la position du dernier) mais la boucle for in, plus simple, convient parfaitement.

Les clés sont assignées à la variable "key", laquelle permet d'obtenir la valeur correspondante. 

var arr = { "un" : 1, "deux" : 2, "trois": 3 };  
for(var key in arr)
{
  var value = arr[key];
  document.write(key + " = " + value + '<br>');
}

Connaître le nombre d'éléments

Puisque nous ne disposons plus de l'attribut length de l'objet Array, il reste à ajouter une méthode à Object qui retourne la taille de la liste:

Object.size = function(arr) 
{
    var size = 0;
    for (var key in arr) 
    {
        if (arr.hasOwnProperty(key)) size++;
    }
    return size;
};

On obtient le nombre d'élément ainsi:

var s = Object.size(x);
document.write("Size=" + s);

Liste des attributs

Depuis la version 1.8.5 de ECMAScript, obtenir la liste des attributs d'un objet se fait en une seule instruction: 

Object.keys(arr)

A partir de là, connaître le nombre de clés devient simple: 

Object.keys(arr).length

La méthode keys retourne un tableau de l'ensemble des attributs, donc des clés, et on peut appliquer l'attribut length de Array. 

var a2 = { "a":1, "b":2, "c":3 }
document.write("Size=" + Object.keys(a2).length)

Obtenir la liste des valeurs

On peut transformer un tableau associatif, autrement dit un objet, en tableau simple. Avec la méthode qui retourne la liste des clés, et la méthode map (ECMAScript 1.6), on obtient les valeurs:

var a3 = Object.keys(a2).map(function (k) { return a2[k];})
document.write(a3)

Résultat:

Voir aussi

© 2010-2014 Xul.fr