Should I use jQuery.inArray()?

Question

I'm doing very frequent searches in arrays of objects and have been using jQuery.inArray(). However, I'm having speed and memory issues and one of the most called methods according to my profiler is jQuery.inArray(). What's the word on the street about its performance? Should I switch to a simple for loop?

My specific function is:

function findPoint(point, list)
{
  var l = list.map(function anonMapToId(p) { return p.id });
  var found = jQuery.inArray(point.id, l);
  return found;
}

Is perhaps list.map() is more to blame?

Solution 1

Well internally inArray makes a simple loop, I would recommend you to check if there is a native Array.prototype.indexOf implementation and use it instead of inArray if available:

function findPoint(point, list) {
  var l = list.map(function anonMapToId(p) { return p.id });
  var found = ('indexOf' in Array.prototype) ? l.indexOf(point.id)
                                             : jQuery.inArray(point.id, l);
  return found;
}

The Array.prototype.indexOf method has been introduced in browsers that implement JavaScript 1.6, and it will be part of the ECMAScript 5 standard.

Native implementations are way faster than non native ones.

Solution 2

What you really want is a Array.prototype.filter.

function findPoint(point, list)
{
     return list.filter(function anonFilterToId(p) { 
         return p.id === point.id; 
     }).length > 0;
}

Solution 3

Even is the inArray function were slow, you're still creating a full new array for every search. I suppose it would be better to redesign this search, by e.g. creating the id-list before finding the points, and using that one to search into:

Solution 4

I'm doing a join of the array to turn it into a string and avoid the loop section like this :

var strList = ","+array.join(",")+",";
return strList.indexOf(","+search+",") !== -1 ? true : false;

if the array is huge, it can hurt, but for a small list it's much faster than the loop solution

PS I'm adding an ending coma to avoid look a like

Solution 5

I always use lastIndexOf when I want to know if there's a string in my array. So, its something like this:

var str = 'a';
var arr = ['a','b','c'];

if( arr.lastIndexOf(str) > -1){ 

      alert("String " + str + " was found in array set");

} else {

      alert("String " + str + " was not found");

}

If you just want to find a string in array, I do believe this might be the best practice.

View more solutions

Comments

[pooja upadhyay]

Can I ask how you are identifiying that this is a performance issue? (just out of curiosity)

[pr1001]

To be honest, I don't remember.

[ICodeForCoffee]

jQuery already does this automatically. forum.jquery.com/topic/inarray (It's on the first comment to the post) As an aside, IE8 doesn't implement Array.prototype.indexOf.

[Rochelle C]

This may not be the prettiest way but it eliminated the "Stop running this script" error I was getting with inArray in IE8.

[JTE]

'inArray' sounds more like it returns a boolean, but it does not. Do the next developer a favor and use 'indexOf'.

[Loudenvier]

I think it will defeat the purpose of "speed" if you don't cache the result of the test for the existence of the indexOf method. I also believe that jQuery will do that for you...