Al mirar la tabla de compatibilidad de ECMAScript, dice que Edge 15 y Edge 16 son compatibles for ... of bucles.

Sin embargo, cuando ejecuto este código:

const list = document.querySelectorAll('[data-test]');
console.log(list);

for (const item of list) {
  console.log(item);
}
<div data-test></div>
<div data-test></div>
<div data-test></div>
<div data-test></div>
<div data-test></div>

Funciona en Chrome y Firefox, pero no en Edge. En su lugar dice:

El objeto no admite la propiedad o el método 'Symbol.iterator'.

Según tengo entendido, NodeList debería admitirlo, ¿verdad?

Aquí hay un campo para probarlo usted mismo: Pruébelo en línea

¿Alguien puede explicar el problema o el error aquí?

3
lampshade 14 nov. 2017 a las 16:41

2 respuestas

La mejor respuesta

Edge admite for... of.

Parece que no admite iteradores en NodeLists. No todos los objetos similares a matrices admiten iteradores y no estoy seguro de si hay algún estándar que diga que NodeLists debe hacerlo.

En cualquier caso, es bastante fácil hacer que for ... of trabaje con ellas:

const list = document.querySelectorAll('[data-test]');

for (const item of Array.from(list)) {
	console.log(item);
}
<div data-test>a</div>
<div data-test>b</div>
<div data-test>c</div>
<div data-test>d</div>
<div data-test>e</div>
7
JLRishe 14 nov. 2017 a las 13:52

Si se admite for..of pero Edge 15 olvidó agregar el comportamiento a NodeList, puede rellenarlo usted mismo con muy poco código:

NodeList.prototype[Symbol.iterator] = function* () {
    for(var i = 0; i < this.length ; i++) {
        yield this[i]
    }
}

Para responder a la otra pregunta (¿se define como iterable en la especificación?), La respuesta es :

La especificación DOM define NodeList como:

interface NodeList {
  getter Node? item(unsigned long index);
  readonly attribute unsigned long length;
  iterable<Node>;
};

Tenga en cuenta la tercera propiedad, iterable<Node>;. Buscando en la especificación de WebIDL:

En el enlace del lenguaje ECMAScript, una interfaz que es iterable tendrá "entradas", "forEach", "claves", "valores" y propiedades @@ iterador en su objeto prototipo de interfaz.

Parece que Edge no implementa nada de eso.

3
Touffy 14 nov. 2017 a las 15:53