Une collection n'est pas un tableau

Je suis contrarié occasionnellement par le fait qu'une collection d'éléments Dom (plus formellement appelée nodelist) ne peut pas être manipulée comme un tableau, car ce n'est pas un. Cependant, cela ressemble à un, et penser que c'est une erreur commise si souvent par des novices JavaScript que pour notre prochaine référence JavaScript, j'ai jugé nécessaire de noter ce point pour chaque objet dom > qui est, ou renvoie, une collection.

Vous pouvez parcourir une collection comme un tableau:

for(var i=0; i<collection.length; i++)
{
	//whatever
}

Mais vous ne pouvez pas utiliser des méthodes de tableau comme push (), splice () ou reverse () pour la manipuler.

Sauf que vous pouvez, si vous passez l'étape suivante et la convertissez en un tableau. Ceci est en fait trivial:

function collectionToArray(collection)
{
	var ary = [];
	for(var i=0, len = collection.length; i < len; i++)
	{
		ary.push(collection[i]);
	}
	return ary;
}

Le code ci-dessus est entièrement croisé et est appelé avec la collection originale comme argument:

var elements = collectionToArray(document.getElementsByTagName('*'));

Cependant, si vous avez seulement besoin de traiter avec les navigateurs qui prennent en charge le prototypage d'objets natifs (Opera, Firefox et Safari 3), vous pouvez simplement créer une méthode ToArray () de nodelist:

NodeList.prototype.toArray = function()
{
	var ary = [];
	for(var i=0, len = this.length; i < len; i++)
	{
		ary.push(this[i]);
	}
	return ary;
};

Qui peut alors être appelé comme méthode de la collection individuelle:

var elements = document.getElementsByTagName('*').toArray();

Il y a un inconvénient évident à cette conversion (aussi fait), c'est-à-dire que le tableau résultant ne sera plus un nodeliste. Évident, oui, mais pertinent parce qu'il a deux implications:

• Il perdra les propriétés et les méthodes dont il a hérité de Nodelist. Cependant, NodeList n'a qu'une seule propriété (sa longueur, qui est également disponible pour un tableau), et une méthode (la méthode élément (), qui est généralement redondante de toute façon, car les membres peuvent toujours être mentionnés avec une notation carrée). Cette perte n'est donc pas du tout significative
• Ce ne sera plus une collection en direct. Un nodelist est une référence à une collection d'objets, et si cette collection change (par exemple, des éléments sont ajoutés ou supprimés), le nodelist se mettra automatiquement à jour pour refléter ce changement; À l'inverse, notre tableau est un instantané statique de la collection à un moment donné, et ne sera donc pas mis à jour en réponse aux changements dans le dom . Selon votre demande, cela pourrait être important.

Les questions fréquemment posées sur les collections et tableaux JavaScript

Quelle est la différence entre une collection et un tableau en javascript?

Dans JavaScript, une collection est un objet qui contient un groupe d'éléments. Ces éléments peuvent être de n'importe quel type, y compris d'autres collections. Les collections sont souvent utilisées lorsque vous devez travailler avec un groupe d'articles similaires, mais ils n'ont pas les mêmes méthodes et propriétés que les tableaux. D'un autre côté, un tableau est un type spécial d'objet qui représente une liste d'éléments. Les tableaux ont des méthodes intégrées pour manipuler et interroger leur contenu, telles que Push, Pop, Shift, Unhift, etc. L'une des méthodes les plus courantes consiste à utiliser la fonction Array.from (). Cette fonction crée une nouvelle instance de tableau à partir d'un objet itérable. Voici un exemple:

LET Collection = Document.GetElementsByTagName ('Div');

LET Array = Array.From (Collection);

Dans cet exemple, la collection de div Elements est convertie en un arroi.

Puis-je utiliser directement des méthodes de collecte car Collisered est-ce que COLLECLE? pas des tableaux. Cependant, vous pouvez convertir une collection en un tableau à l'aide de Array.From () ou de l'opérateur de propagation, puis utiliser des méthodes de tableau sur le tableau résultant.

Quels sont les avantages de l'utilisation de collections sur les tableaux dans JavaScript?

Les collections en JavaScript sont souvent utilisées lorsqu'ils traitent des éléments DOM. Ils fournissent un lien en direct vers le DOM, ce qui signifie que si le DOM change, la collection est automatiquement mise à jour. C'est quelque chose que les tableaux ne peuvent pas faire. Cependant, les tableaux ont des méthodes plus intégrées pour manipuler les données, elles sont donc souvent plus pratiques pour les tâches de manipulation des données.

Qu'est-ce qu'un objet de type tableau dans JavaScript?

Un objet de type tableau est un objet qui a une propriété de longueur et peut stocker des éléments à des indices spécifiques, tout comme un tableau. Cependant, il n'a pas de méthodes de tableau comme push, pop, etc. Un exemple courant d'un objet de type tableau est l'objet d'arguments disponible dans toutes les fonctions.

Comment puis-je identifier si un objet est un tableau ou une collection dans la méthode javascript?

Vous pouvez utiliser la méthode Array.isArray () pour vérifier si un objet est un tableau. Cette méthode renvoie True si l'objet est un tableau et faux autrement. Il n'y a pas de méthode intégrée pour vérifier si un objet est une collection, mais vous pouvez vérifier s'il dispose de certaines propriétés communes aux collections, telles que la longueur ou l'élément.

Puis-je utiliser l'opérateur de diffusion pour convertir une collection en un tableau?

Oui, vous pouvez utiliser l'opérateur de propagation (…) pour convertir une collection en un tableau. L'opérateur de propagation fonctionne en diffusant les éléments de la collection dans un nouveau tableau. Voici un exemple:

LET Collection = Document.getElementsByTagName ('div');
LET Array = [... Collection];

Quelle est la différence entre une collection statique et en direct dans JavaScript?

Une collection en direct dans Javascript est une collection qui a automatiquement des mises à jour lorsque le DOM change. Cela signifie que si des éléments sont ajoutés ou supprimés du DOM, la collection est automatiquement mise à jour pour refléter ces modifications. Une collection statique, en revanche, ne met pas à jour lorsque le DOM change. Une fois qu'il est créé, il reste le même quelles que soient les modifications apportées au dom.

Puis-je ajouter ou supprimer des éléments d'une collection en JavaScript?

Non, vous ne pouvez pas ajouter ou supprimer directement des éléments d'une collection. Les collections sont en lecture seule. Cependant, vous pouvez modifier les éléments DOM sur lesquels la collection est basée, qui à son tour mettra à jour la collection s'il s'agit d'une collection en direct.

Puis-je utiliser ForEach sur une collection en JavaScript?

Non, vous ne pouvez pas utiliser Forado Enseigne directement sur une collection car les collections ne sont pas des tableaux. Cependant, vous pouvez convertir une collection en un tableau à l'aide de Array.from () ou de l'opérateur de propagation, puis d'utiliser ForEach sur le tableau résultant.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!