Wer die faule und praktische Funktion foreach in Javascript vermisst und nicht umbedingt eine große Bibliothek wie jQuery o.ä. laden möchte, dem sei mit dieser Implementierung geholfen.
Javascript foreach für Arrays
Array.prototype.foreach = function( callback ) { for( var k=0; k<this .length; k++ ) { callback( k, this[ k ] ); } } |
Beispiele
var a = [ 'a', 'b', 'c', 'd' ]; a.foreach( function( k, v ) { document.writeln( k + ' ' + v ); }); // dieser Aufruf machte im Firefox 3 aus unerfindlichen Gründen Probleme [ 'a', 'b', 'c', 'd' ].foreach( function( k, v ) { document.writeln( k + ' ' + v ); }); // so mag es auch der Firefox 3 ;[ 'a', 'b', 'c', 'd' ].foreach( function( k, v ) { document.writeln( k + ' ' + v ); }); |
Javascript foreach für Objekte
Object.prototype.foreach = function( callback ) { for( var k in this ) { if(this.hasOwnProperty(k)) { callback( k, this[ k ] ); } } } |
Beispiele
var o = { title:'red', body:'yellow' }; o.foreach( function( k, v ) { document.writeln( k + ' ' + v ); }); |
Also…
ich arbeite eigentlich schon seit Jahren ab und an mit JS und mir ist noch nie aufgefallen, daß es kein “foreach” in JS gibt :-)
Danke für die Infos/workaround!
Die Funktion ist ja auch nicht wirklich notwendig, aber praktisch.
Du greifst auf ein eine Prototype Methode zurück … siehe:
“Array.prototype.foreach…..” und schreibst in deinem Text:
“nicht umbedingt eine große Bibliothek wie jQuery o.ä. laden möchte”
Das passt nicht so ganz zusammen, denn Prototype hat ja glaube um die 124kB und jQuery oder Mootools gerade mal 16 bzw. 18kB.
Also ist meiner Meinung nach die Nutzung von jQuery Prototype vorzuziehen.
LG Chris
@Christian, du verwechselst da etwas. Die Bibliothek prototype hat überhaupt nix mit dem prototype in meinem Snippet zu tun. Am besten du experimentiert mal etwas damit rum, dann siehst du es selber. Als Stichwort für deine Recherche: “Prototypenbasierte Programmierung”
sehrschöner artikel
Hi, mal so eine Sache, wieso ne andere Version für Objekte? Deine erste tuts doch genauso. :) Aber ansonsten sehr schön.
Ups, jetzt hab ich mich vertan, die 2te tuts für beides, so rum.:)
Und ein “hasOwnProperty” wäre an der Stelle noch net.
@s0urce, die Funktion iteriert nur über ihre eigenen Properties (this). Es kann also nicht zu einem undefinierten Zugriff kommen. Wie würdest du nun sinnvoll “hasOwnProperty” nutzen wollen?
Array.prototype.foreach=function(cb) {
for(var k in this)
if(this.hasOwnProperty(k))
cb(k,this[k]);
}
ok, if( typeof this[ k ] != ‘function’ ) tut es zwar auch, aber warum nicht vorhandene Methoden nutzen.
cool, hat auch einwandfrei funktioniert …mit dem FF
jetzt wollte ich meine Seite mal mit dem IE(9) anschauen
und da heißt es:
SCRIPT438: Das Objekt unterstützt die Eigenschaft oder Methode “foreach” nicht
muß ich prototyp beim IE irgendwo definieren oder hat jemand sonst eine gute Idee?
besten Dank im Vorraus
ZEN
Poste mal einen Testlink, damit man sich das ganze “in the wild” anschauen kann.
… und so schön unnötig: Wie wär’s statt dessen einfach mit
var myArray = ['a', 'b', 'c', 'd']
for (var entry in myArray){
doSomething(entry);
}
oder habe ich da irgendwas nicht verstanden?
Beste Grüße,
Jürgen
@Jürgen: eine Alternative, aber unnötig komplex im Code, in deinem Fall vermutlich auch fehlerhaft, da entry in deinem Fall nicht über die Werte des Arrays iteriert, sondern über die Indizes, also der Reihe nach 0, 1, 2, 3 ist. Insofern müsste man “doSomething(myArray[entry])” schreiben.
@naden Die Methode foreach ist durchaus mehr als nur “praktisch”, da sie nicht nur durch die kürzere Notation zur Lesbarkeit von Code beiträgt und klarer signalisiert, was eigentlich gemacht wird, also das Wozu anstelle des Wie hervorhebt. Das Beispiel von Jürgen könnte man sehr verknappen:
['a','b','c','d'].foreach( doSomething );
Wäre sie nur praktisch, weil man auch normal per for-Schleife iterieren kann, dann bräuchte man auch kein for, sondern könnte eine while-Schleife nutzen. Man könnte aber auch auf while verzichten und auf ein (zum Glück in JS nicht nutzbares) konditionales goto setzen. Und am Ende schreiben wir am besten Prozessor-Opcodes, anstatt solche “Makros” zu verwenden. ;)