Sharing several methods to remove duplicates from JavaScript arrays-JS Tutorial-php.cn

Sharing several methods to remove duplicates from JavaScript arrays

小云云

Release： 2018-02-08 11:40:59

Original

1632 people have browsed it

Array deduplication, the general requirement is to give you an array, call the deduplication method, and return a copy of the value. There will be no duplicate elements in the copy. Generally speaking, two elements that return true through === comparison are considered to be the same element and need to be deduplicated. Therefore, 1 and "1" are different elements, and 1 and new Number(1) are different elements, {} and {} are different elements (different references). (Of course, if the requirement is that {} and {} count as the same elements, then the solution will be different). This article mainly shares with you several methods for deduplicating JavaScript arrays.

method 1

Use double loop

function unique(arr) {
 var res = [];
 for(var i = 0, len = arr.length;i < len; i++) {
  var item = arr[i];
  for(var j = 0, jLen = res.length; j<jLen; j++) {
   if(item == res[j]) break;
  }
  if(j == jLen) res.push(item);
 }
 return res;
}

Copy after login

method 2

function unique(arr) {
 var ret = []
 for (var i = 0; i < arr.length; i++) {
 var item = arr[i]
 if (ret.indexOf(item) === -1) {
  ret.push(item)
 }
 }
 return ret
}

Copy after login

You can use a syntax sugar to judge here

function unique(arr) {
 var res = [];
 for(var i = 0, len = arr.length;i < len; i++) {
  var item = arr[i];
  (res.indexOf(item) === -1) && res.push(item);
 }
 return res;
}

Copy after login

But in Lower version browsers do not have indexOf

var indexOf = [].indexOf ?
 function(arr, item) {
  return arr.indexOf(item)
 } :
 function indexOf(arr, item) {
  for (var i = 0; i < arr.length; i++) {
  if (arr[i] === item) {
   return i
  }
  }
  return -1
 }
function unique(arr) {
 var ret = []
 for (var i = 0; i < arr.length; i++) {
 var item = arr[i]
 if (indexOf(ret, item) === -1) {
  ret.push(item)
 }
 }
 return ret
}

Copy after login

method3

Another comparison method using double loops. The previous one is to compare the elements of the original array and the result array one by one. Below we can Put the last element of the repeated elements of the original array into the array

function unique(arr) {
 var ret = [];
 var len = arr.length;
 var isRepeat;
 for(var i=0; i<len; i++) {
  isRepeat = false;
  for(var j=i+1; j<len; j++) {
   if(arr[i] === arr[j]){
    isRepeat = true;
    break;
   }
  }
  if(!isRepeat){
   ret.push(arr[i]);
  }
 }
 return ret;
}

Copy after login

There is also an optimized version

function unique(a) {
 var res = [];
 for (var i = 0, len = a.length; i < len; i++) {
 for (var j = i + 1; j < len; j++) {
  // 这一步十分巧妙
  // 如果发现相同元素
  // 则 i 自增进入下一个循环比较
  if (a[i] === a[j])
  j = ++i; //j = i = i + 1;
 }
 res.push(a[i]);
 }
 return res;
}

Copy after login

method4

Use the object object in javascript as Hash table

function dedup(arr) {
 var hashTable = {};
 return arr.filter(function(value,index,arr){
  var key = JSON.stringify(value);
  var match = Boolean(hashTable[key]);
  return (match ? false : hashTable[key] = true);
 });
}

Copy after login

Because the key values of Object are all String types, 1 and "1" cannot be distinguished. We can make a slight improvement and store the type in the key

function dedup(arr) {
 var ret = [];
 var hash = {};
 for(var i = 0; i < arr.length; i++) {
  var item = arr[i];
  var key = typeof(item) + item;
  if(hash[key] !== 1) {
   ret.push(item)
   hash[key] = 1;
  }
 }
 return ret;
}

Copy after login

Related recommendations:

PHP method code for array deduplication

JS simple method analysis for array deduplication

jQuery simple implementation of array deduplication and sorting operations detailed explanation

The above is the detailed content of Sharing several methods to remove duplicates from JavaScript arrays. For more information, please follow other related articles on the PHP Chinese website!