Home  >  Article  >  Web Front-end  >  Summary of JS array deduplication methods

Summary of JS array deduplication methods

小云云
小云云Original
2018-03-17 16:36:021630browse

This article mainly shares with you a summary of JS array deduplication methods. There are seven methods in total. I hope it can help everyone.

The easiest way:

##?

1

2

3

4

##5

6

7

8

9

10

11

12

13

14

15

16

17

18


var arr=[2,8,5,0,5,2,6,7,2];
function unique1(arr){
  var hash=[];
  for (var i = 0; i < arr.length; i++) {
     if(hash.indexOf(arr[i])==-1){
      hash.push(arr[i]);
     }
  }
  return hash;

}


Method 1:

Double-layer loop, outer loop element, inner loop comparison value

If there is If the values ​​are the same, they will be skipped. If they are not the same, they will be pushed into the array.

?

Method 2: Use splice to operate directly on the original array

Double-layer loop, outer loop element, inner loop comparison value

When the values ​​are the same, delete this value

Note: After deleting the element, you need to reduce the length of the array by 1.

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18


Array.prototype.distinct = function(){

 var arr = this,

  result = [],

  i,

  j,

  len = arr.length;

 for(i = 0; i < len; i++){

  for(j = i + 1; j < len; j++){

   if(arr[i] === arr[j]){

    j = ++i;

   }

  }

  result.push(arr[i]);

 }

return result;

##}

var arra = [1,2,3,4,4,1,1,2,1,1,1];

arra.distinct(); //Return [3,4,2,1]

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19


Array.prototype.distinct = function (){

 var arr = this,

  i,

  j,

  len = arr.length;

 for(i = 0; i < len; i++){

  for(j = i + 1; j < len; j++){

   if(arr[i] == arr[j]){

    arr.splice(j,1);

    len--;

    j--;

#}

#}

 }

 return arr;

};

var a = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,];

var b = a.distinct();

console.log(b.toString()); //1,2,3,4,5,6,56

Advantages: simple and easy to understand

Disadvantages: high memory usage and slow speed

Method 3: Use the properties of objects that cannot be the same to deduplicate

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17


Array.prototype.distinct = function (){

 var arr = this,

  i,

obj = {},

  result = [],

  len = arr.length;

 for(i = 0; i< arr.length; i++){

if(!obj[arr[i]]){ //If it can be found, it proves that the array elements are repeated

obj[arr[i]] = 1;

result.push(arr[ i]);

  }

 }

 return result;

};

var a = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,];

var b = a.distinct();

console.log(b.toString()); //1,2,3,4,5,6,56

Method 4: Recursive deduplication of arrays

Use the recursive idea

Sort first, and then compare from the end, if you encounter the same , then delete


?

##1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20


Array.prototype.distinct = function (){

 var arr = this,

  len = arr.length;

arr.sort(function(a,b){ //Sort the array to facilitate comparison

return a - b;

})

 function loop(index){

  if(index >= 1){</span></strong></span></span></p> <p class="line number9 index8 alt2" style="line-height:15.4px;margin:0px;padding:0px 1em;background-image:none;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;white-space:pre;"><code class="js spaces" style="margin:3px auto 0px;padding:0px 0px 0px 5px;background:rgb(255,255,255);border-left:3px solid rgb(108,226,108);width:640px;font-size:14px;clear:both;border-top:0px;border-right:0px;border-bottom:0px;float:none;height:auto;vertical-align:baseline;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;min-height:auto;">   if(arr[index] === arr[index-1]){

arr.splice(index,1);

}

loop(index - 1); //Recursive loop function to remove duplicates

}

 }

 loop(len-1);

 return arr;

};

var a = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,56,45,56];

var b = a.distinct();

console.log(b.toString());  //1,2,3,4,5,6,45,56

Method Five: Using indexOf and forEach

?

##1

2

3

4

5

6

7

8

9

10

11

12

13

14

15


Array.prototype.distinct = function (){

 var arr = this,

  result = [],

  len = arr.length;

arr.forEach(function(v, i ,arr){ //Use map and filter here The method can also be implemented

var bool = arr.indexOf(v,i+1); // Start looking for duplicates from the next index value of the incoming parameter

  if(bool === -1){

   result.push(v);

  }

 })

 return result;

};

var a = [1,1,1,1,1,1,1,1,1,2,2,2,2,2,2,3,3,3,3,3,3,3,2,3,3,2,2,1,23,1,23,2,3,2,3,2,3];

var b = a.distinct();

console.log(b.toString()); //1,23,2,3

Method 6: Use ES6's set

Set data structure, which is similar to an array, and the values ​​of its members are all unique.

Use Array.from to convert the Set structure into an array

?

##1

2

3

4


function dedupe(array){

 return Array.from(new Set(array));

}

dedupe([1,1,2,3]) //[1,2,3]

#

The expansion operator (...) uses the for...of loop internally

?

1

2

3


#let let arr = [1,2,3,3 ];

let resultarr = [...new Set(arr)];

console.log(resultarr); //[1,2,3]

The following is a supplementary introduction to the method of merging arrays and removing duplicates

##1. concat() method

Idea: The concat() method combines the incoming array or non-array value with the original array to form a new array and returns it. This method will generate a new array.


##1

2

3

4

5

function concatArr(arr1, arr2){

##var arr = arr1.concat (arr2);

arr = unique1(arr);//Refer to any of the above deduplication methods

  return arr;

}

2. Array.prototype.push.apply()

Idea: The advantage of this method is that it does not generate a new array.

?

##1

2

3

4

5

6

7

8

9

10


var a = [1, 2, 3];

var b = [4, 5, 6];

Array.prototype.push.apply(a, b);//a=[1,2,3,4,5,6]

//等效于:a.push.apply(a, b);

//Also equivalent to [].push.apply(a, b);

function concatArray(arr1,arr2){

Array.prototype.push.apply(arr1, arr2);

arr1 = unique1(arr1);

return arr1;

##Related recommendations:

Detailed explanation of array deduplication examples in js

Six ways to deduplicate JS arrays

How to deduplicate JavaScript arrays Ways to share

The above is the detailed content of Summary of JS array deduplication methods. For more information, please follow other related articles on the PHP Chinese website!

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