Tengo un código de muestra tomado de
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for...in_statement
(y solo un poco modificado)
No entiendo por qué el bucle for..of no registra 3, 'myStr', 5, 7, 'hello' (no registra 'hello' ), mientras que el bucle for..in SÍ registra todos los enumerables de arr 0, 1, 2, 3, foo
const arr = [3, 'myStr', 5, 7]; arr.foo = 'hello'; for (let i in arr) { console.log(i); // logs "0", "1", "2", "3", "foo" } console.log("------"); for (let i of arr) { console.log(i); // logs 3, 'myStr', 5, 7 } console.log("------"); console.log(arr); // logs [ 3, 'myStr', 5, 7, foo: 'hello' ] console.log("------");¡Cualquier ayuda apreciada!
( EDITAR: cuando presiona "> Ejecutar fragmento de código" ( stackoverflow ) no registra lo mismo que node.js (motor V8 de Google )
Node.js instalado en los registros de mi computadora:
[ 3, "myStr", 5, 7, foo: "hello" ]"> Ejecutar fragmento de código" (de stackoverflow) registra:
[ 3, "myStr", 5, 7 ]Entonces, tal vez algunas respuestas no sean correctas/precisas.
El bucle for ... of es un método que asigna cada elemento del Array y almacena el valor de ese elemento en una variable (en este caso, i ).
El bucle for ... in es un método para mapear cada elemento en el Array y almacena la clave en la variable i (que en este caso es el índice del elemento).
Ayuda a comprender que una matriz es simplemente un objeto con claves / propiedades numéricas, por lo que mientras que la matriz parece ser esto:
[3, "myStr", 5, 7]
Es, de hecho, esto:
{ 0: 3, 1: "myStr", 2: 5, 3: 7 }Desafortunadamente, no creo que su propiedad "foo" se considere técnicamente "iterable" en el contexto de la matriz de JavaScript a la que la asignó.
Cada tipo de objeto iterable, incluidos los incorporados como Array, puede definir su propio método para determinar qué valores vienen a continuación en una iteración. Entonces, el mecanismo que se mueve de un valor al siguiente durante for...of no está estrictamente ligado a las propiedades asignadas al objeto, como lo está for...in .
Dicho esto, si está realmente interesado en jugar con el protocolo de iteración de JavaScript, esta funcionalidad le permite crear sus propios iterables que expresan el comportamiento de iteración que espera lograr aquí. Si simplemente espera acceder a una lista de valores asociados con los nombres de propiedades de los objetos, el antiguo bucle for...in en el que accede a cada valor por nombre de propiedad es probablemente el enfoque más fácil.
EDITAR: veo su edición anterior sobre la diferencia entre la salida de registro del fragmento de código y la consola de su nodo. Le insto a que no se obsesione demasiado con esta discrepancia, ya que es posible que el comportamiento específico de la implementación de console.log no refleje completamente las estructuras que están registrando. El siguiente fragmento amplía su experimento inicial para ilustrar la diferencia entre "estructura de matriz iterable" y "estructura de objeto no iterable":
const arr = [3, 'myStr', 5, 7]; arr.foo = 'hello'; // Here's the array structure, // note that it lacks the "foo" property assigned to the "arr" object. console.log('Array structure: ', arr); // Here's the ".length" property of arr, // which shows the number of iterable items in its array structure. console.log('Array length property: ', arr.length); // Here is the list of in the arr object, // Including the array indices, and "foo". console.log('Object keys in "arr" object: ', Object.keys(arr)); // Here's the '.length' property of arr's object key list. console.log('Number of keys in "arr" object: ', Object.keys(arr).length);