Javascript对象与数组性能

Question

I want to save data and have quick access to it. All of my data has a unique ID.

I can think of two possibilities.

object:

myObject[id] = myDataObject;

array:

myArray.push(myDataObject);

In the case of an array the ID would be inherited inside the myDataObject. If I want to search for some data now according to the ID, how would I do this. What would be the quickest?

What would be faster respecting following situation:

1. the array is sorted by the ID in the myDataObject everytime a new ID is "pushed"
2. searching the Array for the needed data is done by some kind of quicksort algorithm

How does the object handle this:

var someCrazyID = 1233AFE12B00ED;
console.log(myObject[someCrazyID].attribute);

Does it itterate ober the whole object, or does it do something simular in the background as I would do with the array manually?

Please argument only in the aspect of performance first of all and in the end I would also like to know your general oppinion (maintenance etc.)

Thanks for your help in advance

Answer 1

In javascript, objects are basically hash-maps, meaning that looking up a certain value given a key is a constant O(1) cost operation. That makes objects ideal for lookup-based functionality, so you probably want to go with objects, so there will be no need for sorting (of course, objects by definition are an unsorted collection of their key-value pairs), and the lookup will be fast regardless.

Do note though that in JS arrays are also objects, with the same lookup properties, the only difference is that they follow the convention of using subsequent integers for keys. If your IDs are integers, you can also create a sort of sparse array by using the IDs as indexes, but that's basically the same as creating an object with the IDs as keys.

Answer 2

Depends on how many objects you wish to store. If there aren't many objects then access by object property is just fine. However, with increasing amount of data arrays will be a way faster.

Let's test it and perform an experiment.

Repeat access to object property and array for 1 million times and measure times.

var obj = new Object(),
    arr = [];

// init
// let's give our object 1 million properties and to array 1 million elements
for (var i=0; i<1000000; i++) {
    obj[i] = i; //instead of obj["prop"+(i)]
    arr.push(i);
};

// let's repeat access to object property 1 million times
var d1 = (new Date()).getTime();

var x;
for (var i=0; i<1000000; i++) {
   x = obj[i]; //instead of obj["prop"+(i)]
}

var ms1 = (new Date()).getTime() - d1;
alert("Access to object property took " + ms1 + "ms.");

// now let's repeat access to array 1 million times
var d2 = (new Date()).getTime();

var y;
for (var i=0; i<1000000; i++) {
   y = arr[i];
}

var ms2 = (new Date()).getTime() - d2;
alert("Access to array took " + ms2 + "ms.");

Here is JSFiddle: http://jsfiddle.net/0d7qu0hd/1/

The results on my laptop are clear:

Accessing object member: 500ms on average

Accessing array by index: 3ms on average

EDIT: As Max pointed out - the conversion really takes additional time. Without a conversion the results are the same.

EDIT 2: After performing several tests it seems that accessing obj[i] is slightly faster than array[i]. 2ms vs. 3-4 ms.