JavaScript: implementare foreach in modo cross-browser

JavaScript: implementare foreach in modo cross-browser

L'introduzione della funzione forEach in JavaScript è una novità abbastanza recente. Come al solito, tuttavia, prima di poter utilizzare una nuova caratteristica è necessario attendere che il supporto dei browser lo consenta. Al momento, dato che Internet Explorer 8 è ancora molto diffuso, questa funzione può essere implementata in modo alternativo. Vediamo come.

JavaScript è sensibile alle maiuscole ed alle minuscole, quindi scriveremo il nome della funzione in minuscolo:


function foreach(haystack, callback) {
    for (var i in haystack) {
        if (typeof(haystack[i]) !== 'function') {
            callback(i, haystack[i]);
        };
    };
};

La funzione passa in rassegna le proprietà di un oggetto e se queste non sono funzioni invoca la funzione di callback utilizzando il nome e il valore della proprietà corrente come parametri.

Dato che le collezioni di nodi del DOM sono anch'esse oggetti, possiamo utilizzare la nostra funzione anche su un set di elementi HTML. Data la seguente marcatura:


<ul id="test">
	<li>A</li>
	<li>B</li>
	<li>C</li>
</ul>​

possiamo scrivere il seguente codice:


var set = document.getElementById('test').getElementsByTagName('li');

foreach(set, function(index, element) {
    element.className = 'test';
});​

Potete visionare l'esempio finale in questa pagina.

Torna su