在javascript对象中，获取值属性的最佳方法是什么？

Question

if we have a javascript object

var calories = { apple:200, pear:280, banana:300, peach:325 }

what is best way to find the (first) fruit that has 280 calories?

could Object.getOwnPropertyNames(calories).forEach... but there should be a better way.

For example, I was thinking of Array.prototype.indexOf() which does the same thing for an Array.

Answer 1

Caution! There is no guarantee that all browsers return the same result. In fact they don't.

For example:

var x = { a: 1, b: 1 };
delete x.a;
x.a = 1;

What should x.indexOf(1) return here? b or a ? Turns out IE does property enumeration differently than other browsers, and the specs say that's perfectly fine. So IE would return a while other browsers would return b .

You can verify that by calling

Object.getOwnPropertyNames(x); // IE: a,b - other browsers: b,a
Object.keys(x); // same
for (var i in x) { console.log(i); } // same

Obviously, the problem here is that there's no notion of "order" on object indices because, well, that's what objects are: unordered maps.

Answer 2

but there should be a better way

No, there really shouldn't. The way 99% of all use cases go, developers are more interested in getting the value from the key.

Answer 3

Linear search using for..in construct:

var fruit = null;

for (var prop in calories) {

  if (calories[prop] == 280) {

    fruit = prop;
    break;
  }
}

Answer 4

You could extend the prototype of Object doing this:

// Returns one key (any) of the value if it exists, or undefined if not
Object.defineProperty(Object.prototype, "keyOf", { 
    value: function(value) {
        for (var key in this) if (this[key] == value) return key;
        return undefined;
    }
});

Using this way instead of the common Object.prototype.keyOf = ... will work with jQuery if you use it.

And then you could use it like this:

var myArray = {...};
var index = myArray.keyOf(value);

It will also work with normal arrays: [...] , so you could use it instead of indexOf too.

Remember to use the triple-character operators to check if it's undefined:

index === undefined // to check the value/index exists    
index !== undefined // to check the value/index does not exist

Of course you could change the name of the function if you prefer and remember not to declare any variable called 'undefined'.

Remember also that as indexOf, it will return at most one key defined but it could be more than one possible, so in that case you will need something like this ( .keysOf(...) ):

// Returns all the keys of the value if it exists (an empty array if not)
Object.defineProperty(Object.prototype, "keysOf", { 
    value: function(value) {
        var allKeys = [];
        for (var key in this) if (this[key] == value) allKeys.push(key);
        return allKeys;
    }
});