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

Summary of js array deduplication methods_javascript skills

WBOY
Release: 2016-05-16 15:48:09
Original
1429 people have browsed it

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;
 }
Copy after login

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;
 }

Copy after login

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;
 }
Copy after login

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;
 }

Copy after login

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}

Copy after login

New element

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

Copy after login

Delete element

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

Copy after login

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);
}

Copy after login

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);
});
Copy after login

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

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template