Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
I am the chief technical officer at InVision App, Inc - a prototyping and collaboration platform for designers, built by designers. I also rock out in JavaScript and ColdFusion 24x7.
Meanwhile on Twitter
Loading latest tweet...
Ben Nadel at the jQuery Conference 2010 (Boston, MA) with:

Javascript Objects Cannot Have Complex Index Values

By Ben Nadel on

This was just a shot in the dark, but I wanted to see if Javascript Objects could be indexed by other objects rather than just strings (yes I know Strings are technically objects too). I wanted to see if something along these lines would work:

  • var objIndex = {
  • DOMElement: { ... },
  • DOMElement: { ... },
  • DOMElement: { ... },
  • ... etc ...
  • };

Basically, I wanted to see if Javascript objects could act like Java HashTables that can take any type of object as an index value.

After some quick testing, I realized that this did not work. At first, though, I thought it might because no errors were thrown. Javascript actually lets you do this; but, not in the I wanted - what it actually does (from what I can gather) is that it creates an index value in the following manner:

  • var objIndex = {
  • DOMElement: { ... }
  • };

... becomes:

  • var objIndex = {
  • DOMElement.toString(): { ... }
  • };

I believe that Javascript objects requires string-based indexing and therefore takes any object that you pass to it (to be used as an index value) and converts it to a string. Part of the problem is that this string version of the object is rather generic. The P and SPAN tags convert to the following regardless of markup (in FireFox):

[object HTMLParagraphElement]
[object HTMLSpanElement]

Therefore, all P and SPAN tags would be indexed using the same values (respectively) no matter how many there were in the page.

Anyway, it was just a thought.



Reader Comments

If you override an object's toString() method, then you can control how JavaScript sets the key.

domElement.toString = function() {
return this.id;
};

Sadly, IE doesn't let you override for DOM objects. But this works for custom objects in all browsers.

Reply to this Comment

Post A Comment

?
You — Get Out Of My Dreams, Get Into My Comments
Live in the Now
Oops!
Comment Etiquette: Please do not post spam. Please keep the comments on-topic. Please do not post unrelated questions or large chunks of code. And, above all, please be nice to each other - we're trying to have a good conversation here.