Home  >  Article  >  Web Front-end  >  Summary of js array deduplication methods_javascript skills

Summary of js array deduplication methods_javascript skills

WBOY
WBOYOriginal
2016-05-16 15:48:091370browse

Three methods

Use indexOf to determine the new array

A similar indexOf
is actually used in underscore.js

 //传入数组
 function unique1(arr){
  var tmpArr = [];
  for(var i=0; i<arr.length; i++){
   //如果当前数组的第i已经保存进了临时数组,那么跳过,
   //否则把当前项push到临时数组里面
   if(tmpArr.indexOf(arr[i]) == -1){
    tmpArr.push(arr[i]);
   }
  }
  return tmpArr;
 }

Use indexOf to determine the old array

 function unique2(arr){
  var tmpArr = []; //结果数组
  for(var i=0; i<arr.length; i++){
   //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
   //那么表示第i项是重复的,忽略掉。否则存入结果数组
   if(arr.indexOf(arr[i]) == i){
    tmpArr.push(arr[i]);
   }
  }
  return tmpArr;
 }

Use hash to search

The implementation of JS objects used here is the characteristics of the hash table

 function unique3(arr){
  var tmpArr = [], hash = {};//hash为hash表
  for(var i=0;i<arr.length;i++){
   if(!hash[arr[i]]){//如果hash表中没有当前项
    hash[arr[i]] = true;//存入hash表
    tmpArr.push(arr[i]);//存入临时数组
   }
  }
  return tmpArr;
 }

Array expansion

 Array.prototype.unique1 = function (){
  var tmpArr = []; 
  for (var i = 0; i < this.length; i++){
   if (tmpArr.indexOf(this[i]) == -1){
    tmpArr.push(this[i]);
   }
  }
  return tmpArr;
 }

 Array.prototype.unique2 = function(){
   var tmpArr = []; //结果数组
   for(var i = 0; i < this.length; i++){
    if (this.indexOf(this[i]) == i){
     tmpArr.push(this[i]);
    }
   }
   return tmpArr;
 }

 Array.prototype.unique3 = function(){
   var tmpArr=[], hash = {};
   for(var i = 0; i < this.length; i++){
    if (!hash[this[i]]){
      hash[this[i]] = true; 
      tmpArr.push(this[i]); 
    }
   }
   return tmpArr;
 }

Use Set

Set and Map are new data structures in ES6
Set can directly store a non-duplicate set of keys. This key can also be an object, a string, etc.
Create set

var s = new Set([1, 2, 3,]);
s; // Set {1, 2, 3}

New element

>>> s.add(4)
>>> s
{1, 2, 3, 4}
>>> s.add(4)
>>> s
{1, 2, 3, 4}//重复元素不会被添加

Delete element

s; // Set {1, 2, 3, 4}
s.delete(3);
s; // Set {1, 2, 4}

Traverse elements

Map and Set cannot use subscripts
The ES6 standard introduces a new iterable type. Array, Map and Set all belong to iterable types

var s = new Set(['A', 'B', 'C']);

for (var x of s) { // 遍历Set
  alert(x);
}

Or directly use iterable’s built-in forEach method
The forEach method is introduced by the ES5.1 standard

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, set) {
  alert(element);
});

The above is the entire content of this article, I hope you all like it.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn