Home >Web Front-end >JS Tutorial >How to remove duplicates from a javascript array

How to remove duplicates from a javascript array

藏色散人
藏色散人Original
2021-04-08 11:22:428400browse

How to remove duplicate values ​​from JavaScript arrays: 1. Use the "indexOf()" method to remove duplicate values; 2. Use the splice method to remove duplicate values; 3. Use the new set Set in es6 to remove duplicate values.

How to remove duplicates from a javascript array

The operating environment of this article: windows7 system, javascript version 1.8.5, Dell G3 computer.

Several methods to remove duplicate values ​​​​in js arrays

In daily development, we may encounter removing duplicate values ​​​​in an array, then, I will share several methods that I have learned

Methods to remove duplicate values ​​from arrays:

1, use the indexOf() method to remove

Ideas: Create an Create a new array, then loop through the array to be duplicated, and then use the new array to find the value of the array to be duplicated. If it cannot be found, use .push to add it to the new array, and finally return the new array back.

It doesn’t matter if you don’t understand it, it will be easier to understand after reading the code

function fun(arr){
 let newsArr = [];
 for (let i = 0; i < arr.length; i++) {
  if(newsArr.indexOf(arr[i]) === -1){
   newsArr.push(arr[i]);
  }
 }
 return newsArr;
}

2, use the splice method to remove

Idea: This method somewhat imitates bubbling. Two layers of loops, the outer loop traverses the array, The inner loop compares the values. If they are the same, use splice to remove them and return the processed array.

It doesn’t matter if you don’t understand it. The code will be easier to understand

function fun(arr){
 for (let i = 0; i < arr.length; i++) {
  for(let j = i+1; j < arr.length; j++){
   if(arr[i]==arr[j]){
    arr.splice(j,1);          j--;
   }
  }
 }
 return arr;
}

3. Use es6's new set Set removal

Here is a brief introduction to the Set collection. It is very familiar with arrays, but it is not an array, but a collection. There are also many methods in it, such as add (add), delete (delete), check (has), etc.

Its most important feature is: elements cannot be repeated, that is, the same elements will not appear in the Set collection

Set deduplication solution 1:

Idea: Because the Set collection Duplicate values ​​are not allowed in it, so we can use this feature to pass our array in to remove duplication

First create a new Set and pass the deduplicated array as a parameter, then create a new array and loop Traverse the collection, add each collection element to the new array, and finally return the new array

function fun(arr){
 let s1 = new Set(arr);
 let arr2 = [];
 for(let item of s1){
  arr2.push(item);
 }
 return arr2;
}

Set deduplication solution 2 (use the array method Array.form()):

Idea: Array.from(); can convert pseudo arrays and collections into array types. This method combined with the Set collection just meets our needs

[Recommended learning: javascript advanced tutorial

function fun(arr){
 let s1 = new Set(arr); 
 return Array.from(s1);
}

Set deduplication solution 3 (using es6 expansion operator...):

Idea: es6 expansion operator can convert an array into a comma-separated parameter sequence

function fun(arr){
 let s1 = new Set(arr); 
 return [...s1];
}

The above is the detailed content of How to remove duplicates from a javascript array. 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