Remove duplicate elements from array using JavaScript

Question

uniqueElementArray= Array.filter(function(itm,i,Array){
                return i==Array.indexOf(itm);
                });

Array contains set of 1000 or even more than 1000 elements. We want to get unique elements from this array. We are using function which is mentioned above finally we are getting unique Elements array but it's creating performance issue. How can i increase the performance. It's taking too much time in IE8 and IE9.w

Answer 1

I recommend using underscore.js:

var otherArray = _.uniq(array);

You can see how it's implemented here.

Answer 2

If you can sort the array (change order of elements), this function seems handy:

unique = function(in_array) {
    var last, result=[];
    in_array.sort();
    for (var i in in_array) if (in_array[i] != last) result.push(last=in_array[i]);
    return result;
}

EDIT:

See also this answer, I think it's great!.

Answer 3

Use it this way :

var array = Array.prototype.indexOf ?
function(arr, val) {
    return arr.indexOf(val) > -1;
} :

function(arr, val) {
    var i = arr.length;
    while (i--) {
        if (arr[i] === val) {
            return true;
        }
    }
    return false;
}

function removeRedundant(arr, equals) {
  var val, origArr = arr.slice(0);
  arr.length = 0;

  for (var i = 0, len = origArr.length; i < len; ++i) {
    val = origArr[i];
    if (!array(arr, val)) {
        arr.push(val);
    }
  }

  return arr;
}

var arr = [1, 2, 2, 1, 3];
removeRedundant(arr);
console.log(arr); // [1, 2, 3]

Answer 4

In IE8 I've experienced absurdly slow performance when comparing a bunch of floats. In that case asynchronous handling is the only option you have to not get the "script takes too long" message.

IE8 does not have Array.filter function so your code would not work in IE8 anyway.

//create an array with 10.000 floats
var arr=[];
for(i=0;i<10000;i++){
  arr.push(Math.random());
}
//adding one double float to make sure it will be removed
arr.push(arr[5]);
console.log("array created:",arr.length);
var now=new Date();
function getUniqueDone(arr){
    console.log("done asynch",(new Date().getTime())-now);
    console.log("length of array:"+arr.length);//usually is 10.000
}
// works only on arrays containing numbers or strings
function getUnique(arr,callback){
  var i,j,len,counter,
  chuncksOf=1000;//In IE8 I get script warnings at 150 already,
  //  FF and Chrome could handle 1000
  //  depending on what your array contains you can test a bit and
  //  set chuncksOf accordingly. current value does nnot work in IE8
  //  you have to set it to 100 and wait 20 seconds for output
  if(arr.sort){
      // on very large arrays this still might have a problem
      console.log("sorting");
      arr.sort();
      console.log("sort done");
      i=0;
  }else{
      i=arr.i;
      arr=arr.arr;
  } 
  len=arr.length;
  counter=0;
  while(i<len&&counter<chuncksOf){
    for(j=i+1;j<arr.length;j++){
      if(arr[i]===arr[j]){
        arr.splice(j,1);
        j--;
      }
    }
    i++;
    counter++;
  }
  if(i>=len){
      callback(arr);
  }else{
      var pass={
        arr:arr,
        i:i
      }
console.log("i is now:",i);
      setTimeout(function(){
          getUnique(pass,callback);
      },0);
  }
}
console.log("getting unique");
getUnique(arr,getUniqueDone);