Assoziative Arrays mit Javascript

Ich als PHP Entwickler habe öfter mal das Problem, dass ich die Behandlung von assoziativen Arrays, so wie ich sie von PHP mit foreach- oder for-Schleifen kenne, vermisse. Vielleicht sollte ich jetzt sagen, dass ich das Problem hatte. Denn die Lösung ist verdammt einfach.

Assoziative Arrays mit JavascriptBisher habe ich für gute Javascript Lösungen mit PHP Feeling immer auf der guten alten php.js Website nachgesehen, um das Handling von Daten in Javascript zu erleichtern. Letztendlich sind dort auch viele PHP Funktionen mit Javascript umgesetzt, so dass man diese wie gewohnt auch in Javascript nutzen kann, nur bläht sich dadurch natürlich manchmal der eigentliche Code extrem auf. Aus diesem Grund sollte man natürlich auf die Javascript eigenen Methoden zurückgreifen, sofern sie denn ausreichend sind.

Anwendungsbeispiel

Angenommen wir haben ein Javascript Objekt mit mehreren Inhalten. Javascript Objekte können in Javascript generell wie ein Assoziatives Array behandelt werden. Unser Javascript Objekt soll einfach mal so aussehen:

function MyObject() {
    this.Sender = 'Marcel';
    this.Empfaenger = 'Jemand Anderes';
    this.Betreff = 'Meine Betreffzeile';
    this.Text = 'Lorem Ipsum';
}

Unser Objekt hat also vier Member Sender, Empfaenger, Betreff und Text. Würden wir uns in einer PHP Umgebung befinden, könnte man die Schlüssel und Werte einfach mit einer foreach-Schleife ermitteln. Im Grunde genommen funktioniert dies in Javascript genau so einfach:

var data = new MyObject();
for (var i in data) {
    alert('data[\'' + i + '\'] hat den Wert ' + data[i] + '.');
}

Diese kleine for-Schleife gibt uns nun die Schlüssel und die Werte eines Javascript Objektes aus, welches in diesem Fall wie ein assoziatives Array behandelt wird. In der Variablen i werden die Schlüssel des Objektes gespeichert. Man kann also direkt auf diese Variable zugreifen, um den Schlüssel zu verwenden. Um auf einen Wert zurückzugreifen, benutzt man wie gewohnt das eigentliche Objekt mit der Variablen i als Schlüssel. Man erzielt hiermit genau das gleiche key / value Verhalten wie man es von einer foreach-Schleife aus PHP kennt.

Also, Javascript ist keine Zauberei – auch wenn es manchmal eher an einen großen Krampf erinnert. Um es in Markus Kafka’s Worten zu sagen: Haben wir wieder was gelernt! 😉

About Author: Marcel
Ich bin Senior PHP Developer bei MM Newmedia. Seit 2005 bin ich begeisterter Webentwickler und arbeite als Freelancer für namenhafte Firmen und entwickle jede Menge abgefahrenes Zeug und berichte darüber in meinem Blog.

4 thoughts on “Assoziative Arrays mit Javascript

  • although arrays in js are just objects with array-like properties, this is not using the array constructor. it won’t be iterable in the normal sense as it lacks length property and you can’t loop it using a normal „for/while“ loops. you really ought to go about this differently, eg, var arr = []; arr[’sender‘] = ‚me‘; etc. – then you can use for … in to obtain the array keys if you have to (keep in mind that array prototyping spills into such loops and you need hasOwnProperty() before you accept the key). if you don’t care about the keys, then use a normal loop instead, its MUCH faster. also, using „for … in“ in javascript does NOT guarantee the order on which the items will return.

  • Hey Dimitar,

    thanks a lot for your response. In this particular case I had to use for … in because the object was an ajax response in json format. As a result of json decoding in prototype you will always recieve an object.

    But your advice is really usefull. Thanks for that. I ‚ll extend this article as soon as possible.

  • Wenn man bereits jQuery in sein Projekt eingebunden hat, dann kann man auch auf $.each() zurückgreifen.

  • also ich versteh nur bahnhoff.
    es ist schon bleed wenn man bleed is. 😉

Kommentar verfassen