JavaScript Les tableaux sont des objets


Exemple

Clause de non-responsabilité: la création d'objets de type tableau n'est pas recommandée. Cependant, il est utile de comprendre leur fonctionnement, en particulier lorsque vous travaillez avec DOM. Cela expliquera pourquoi les opérations de tableau régulières ne fonctionnent pas sur les objets DOM renvoyés par de nombreuses fonctions de document DOM. (ie querySelectorAll , form.elements )

En supposant que nous ayons créé l'objet suivant qui a des propriétés que vous pouvez vous attendre à voir dans un tableau.

var anObject = {
    foo: 'bar',
    length: 'interesting',
    '0': 'zero!',
    '1': 'one!'
};

Ensuite, nous allons créer un tableau.

var anArray = ['zero.', 'one.'];

Maintenant, remarquez comment nous pouvons inspecter à la fois l'objet et le tableau.

console.log(anArray[0], anObject[0]); // outputs: zero.  zero!
console.log(anArray[1], anObject[1]); // outputs: one.  one!
console.log(anArray.length, anObject.length); // outputs: 2 interesting
console.log(anArray.foo, anObject.foo); // outputs: undefined bar

Depuis anArray est en fait un objet, tout comme anObject , nous pouvons même ajouter des propriétés personnalisées verbeux à anArray

Clause de non-responsabilité: les tableaux avec des propriétés personnalisées ne sont généralement pas recommandés car ils peuvent être source de confusion, mais ils peuvent être utiles dans les cas avancés où vous avez besoin des fonctions optimisées d'un tableau. (ie objets jQuery)

anArray.foo = 'it works!';
console.log(anArray.foo);

Nous pouvons même rendre anObject un objet de type tableau en ajoutant une length .

anObject.length = 2;

Ensuite, vous pouvez utiliser le style C for boucle pour parcourir un anObject comme s'il s'agissait d'un tableau. Voir Itération du tableau

Notez que anObject est uniquement un objet de type tableau . (également connu sous le nom de liste) Ce n'est pas un vrai tableau. Ceci est important, car les fonctions comme push et forEach (ou toute fonction pratique trouvée dans Array.prototype ) ne fonctionneront pas par défaut sur les objets de type tableau.

La querySelectorAll fonctions du document DOM querySelectorAll une liste (c.-à-d. querySelectorAll , form.elements ) qui est similaire à l’ anObject nous avons créé ci-dessus. Voir Conversion d'objets de type tableau en tableaux

console.log(typeof anArray == 'object', typeof anObject == 'object'); // outputs: true  true
console.log(anArray instanceof Object, anObject instanceof Object); // outputs: true  true
console.log(anArray instanceof Array, anObject instanceof Array); // outputs: true  false
console.log(Array.isArray(anArray), Array.isArray(anObject)); // outputs: true  false