array - javascript foreach object

JavaScript-Matices de myArray.forEach vs for loop

Question

He visto muchas preguntas que sugieren usar:

for (var i = 0; i < myArray.length; i++){ /* ... */ }

en lugar de:

for (var i in myArray){ /* ... */ }

para matrices, debido a la iteración inconsistente ( ver aquí ).

Sin embargo, parece que no puedo encontrar nada que parezca preferir el bucle orientado a objetos:

myArray.forEach(function(item, index){ /* ... */ });

Lo cual me parece mucho más intuitivo.

Para mi proyecto actual, la compatibilidad de IE8 es importante, y estoy considerando usar el polyfill de Mozilla , sin embargo, no estoy 100% seguro de cómo funcionará.

• ¿Hay alguna diferencia entre el estándar for loop (el primer ejemplo anterior) y la implementación Array.prototype.forEach de los navegadores modernos?
• ¿Hay alguna diferencia entre las implementaciones modernas del navegador y la implementación de Mozilla vinculada a las anteriores (con especial atención a IE8)?
• El rendimiento no es un gran problema, solo la coherencia con la que se iteran las propiedades.

Answer 1

Algunos desarrolladores (por ejemplo, Kyle Simpson) .forEach utilizar .forEach para indicar que la matriz tendrá un efecto secundario y .map para funciones puras. for bucles en esta ecuación, entonces, en mi opinión, cabe en esta ecuación como una solución de propósito general que es más fácil de comunicar, ya que se admite en una gran cantidad de idiomas, especialmente cuando el número de iteraciones está precalculado.

Answer 2

La diferencia más importante entre el bucle for y el método forEach es que, con el primero, puede salir del bucle. Puede simular continue simplemente volviendo de la función pasada a forEach , pero no hay forma de detener el bucle por completo.

Aparte de eso, los dos logran efectivamente la misma funcionalidad. Otra diferencia menor implica el alcance del índice (y todas las variables que lo contienen) en el ciclo for, debido a la elevación variable.

// ''i'' is scoped to the containing function
for (var i = 0; i < arr.length; i++) { ... }

// ''i'' is scoped to the internal function
arr.forEach(function (el, i) { ... });

Sin embargo, me parece que forEach es mucho más expresivo: representa tu intención de iterar a través de cada elemento de una matriz, y te proporciona una referencia al elemento, no solo al índice. En general, todo se reduce a un gusto personal, pero si puedes usar forEach , te recomendaría usarlo.

Hay algunas diferencias más sustanciales entre las dos versiones, específicamente con respecto al rendimiento. De hecho, el bucle for simple tiene un rendimiento considerablemente mejor que el método forEach , como lo demuestra esta prueba jsperf .

Si usted necesita o no tal desempeño es decisión suya, y en la mayoría de los casos, preferiría la expresividad sobre la velocidad. Esta diferencia de velocidad probablemente se deba a las diferencias semánticas menores entre el bucle básico y el método cuando se opera en matrices dispersas, como se señala en esta respuesta .

Si no necesita el comportamiento de forEach y / o necesita salir temprano del ciclo, puede usar Lo-Dash como alternativa, lo que también funcionará en todos los navegadores. Si está utilizando jQuery, también proporciona un $.each similar, solo tenga en cuenta las diferencias en los argumentos pasados ​​a la función de devolución de llamada en cada variación.

(En cuanto al para forEach polyfill, debería funcionar en navegadores más antiguos sin problemas, si elige seguir esa ruta).

Answer 3

Puede usar su función foreach personalizada que funcionará mucho mejor que Array.forEach

Debe agregar esto una vez a su código. Esto agregará una nueva función a la matriz.

function foreach(fn) {
    var arr = this;
    var len = arr.length;
    for(var i=0; i<len; ++i) {
        fn(arr[i], i);
    }
}

Object.defineProperty(Array.prototype, ''customForEach'', {
    enumerable: false,
    value: foreach
});

Entonces puedes usarlo en cualquier lugar como el Array.forEach

[1,2,3].customForEach(function(val, i){

});

La única diferencia es 3 veces más rápido. https://jsperf.com/native-arr-foreach-vs-custom-foreach

ACTUALIZACIÓN: en la nueva versión de Chrome, se mejoró el rendimiento de .forEach (). Sin embargo, la solución puede proporcionar el rendimiento adicional en otros navegadores.