Differenza tra forEach e loop in javascript

Question

Mi chiedo: C'è una differenza significativa tra il ciclo forEach e for in JavaScript.

Considerate questo esempio:

var myArray = [1,2,3,4]; 

myArray.forEach(function(value) { 
    console.log(value); 
}); 

for (var i = 0; i < myArray.length; i++) { 
    console.log(myArray[i]); 
} 

Ecco parte della mia ricerca:

1. Prestazioni: Secondo JsPerf: forEach è poco più lento del ciclo for.
2. Usabilità: Non è possibile interrompere/tornare dalla richiamata in caso di ciclo forEach.

Ad esempio: Si desidera scoprire se un numero è primo o meno. Penso che l'uso di for loop sia molto più semplice dell'uso di forEach per farlo.

3. Leggibilità: L'utilizzo del ciclo for rende il codice più leggibile rispetto a quello perOgni codice.
4. Compatibilità del browser: forEach non è supportato in IE < 9 In tal modo viene introdotto uno shim nel nostro codice.

Le mie domande sono:

1. Quali sono i vantaggi di forEach sopra per il ciclo?
2. In quali scenari, perEach è più preferibile.
3. Perché è entrato in JavaScript? Perché era necessario?

Answer 1

forEach è un metodo sul prototipo Array. Esso scorre ogni elemento di una matrice e lo passa a una funzione di callback.

Quindi, fondamentalmente, forEach è un metodo rapido per il caso d'uso "passare ogni elemento di un array ad un function". Ecco un esempio comune in cui penso che Array.forEach è molto utile, a fronte di un ciclo for:

// shortcut for document.querySelectorAll 
function $$(expr, con) { 
    return Array.prototype.slice.call((con || document).querySelectorAll(expr)); 
} 

// hide an element 
function hide(el) { 
    el.style.display = 'none'; 
} 

// hide all divs via forEach 
$$('div').forEach(hide); 

// hide all divs via for 
for (var divs = $$('div'), i = 0; i < divs.length; i++) { 
    hide(divs[i]) 
} 

Come si può vedere, la leggibilità del foreach è migliorata rispetto ad un ciclo for.

D'altra parte, una dichiarazione for è più flessibile: non implica necessariamente un array. Le prestazioni di un normale ciclo for sono leggermente migliori, poiché non esiste una chiamata di funzione per ciascun elemento coinvolto. Nonostante ciò, si consiglia di evitare i loop for quando può essere scritto come un'istruzione forEach.

Answer 2

In un ciclo forEach non si controlla il modo in cui si esegue iterazione sull'array. Il classico ciclo for consente di scegliere l'algoritmo di iterazione desiderato (i++; i--; i+=2*i, ecc.).

Tuttavia, un ciclo forEach è molto più facile da usare - non c'è bisogno di pasticciare con tutto il conteggio i, trovare l'oggetto array[i] - JS lo fa per te.

Answer 3

>> sparseArray = [1, 2, , 4]; 

>> sparseArray.forEach(console.log, console); 
1 0 [1, 2, 3: 4] 
2 1 [1, 2, 3: 4] 
4 3 [1, 2, 3: 4] 

>> for(var i = 0; i < sparseArray.length; ++i) { console.log(sparseArray[i]) }; 
1 
2 
undefined 
4 

forEach è una recente aggiunta per rendere possibile espressivo stile di elenco-di comprensione in javascript. Qui si può vedere che forEachsalta elementi che non sono mai stati impostati, ma il meglio che puoi fare con un ciclo for è quello di verificare la presenza di undefined o null, entrambi i quali possono essere impostati come valori e raccolto da forEach. A meno che non si aspettino valori mancanti, lo forEach equivale ai cicli for, ma si noti che non è possibile interrompere prima, per cui è necessario every.