JavaScript commonly used array deduplication actual combat source code

JavaScript commonly used array deduplication actual combat source code

Array deduplication is usually encountered during job interviews, and you are usually required to hand-write the code for the array deduplication method. If you are asked, what are the methods to deduplicate arrays? If you can answer 10 of them, the interviewer will likely be impressed by you.
In real projects, array deduplication is usually handled by the background, and rarely by the front end. Although the probability of using it in daily projects is relatively low, you still need to understand it in case you are asked about it during the interview.

1. Using object properties

Use the unique attribute name feature of objects.

var arr = ['qiang','ming','tao','li','liang','you','qiang','tao'];
console.time("nonredundant1");
var nonredundant1 = Object.getOwnPropertyNames(arr.reduce(function(seed, item, index) {
    seed[item] = index;
    return seed;
},{}));
console.timeEnd("nonredundant1");
console.log(nonredundant1);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

2. Using the Set Data Structure

A set is a structure similar to an array, but there are no duplicate values ​​in the set members. The set() function can accept an array or array-like parameter to generate a set object. The Array.from method is used to convert two types of objects into real arrays: array-like objects (array-like objects and iterable objects) including the data structures Set and Map added by ES6).

var arr = ['qiang','ming','tao','li','liang','you','qiang','tao'];
function unique(arr) {
    return Array.from(new Set(arr))
}
console.time("nonredundant2");
var nonredundant2 = unique(arr);
console.timeEnd("nonredundant2");
console.log(nonredundant2);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

3. Using for loop and splice

function unique(arr) {
    for (var i = 0; i < arr.length; i++) {
        for (var j = i + 1; j < arr.length; j++) {
            if (arr[i] == arr[j]) { //The first one is equal to the second one, the splice method deletes the second one arr.splice(j, 1);
                j--;
            }
        }
    }
    return arr;
}
console.time("nonredundant3");
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
var nonredundant3 = unique(arr);
console.timeEnd("nonredundant3");
console.log(nonredundant3);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

4. Use indexOf to determine duplicate removal

function unique(arr) {
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array.push(arr[i])
        }
    }
    return array;
}
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
console.time("nonredundant4");
var nonredundant4 = unique(arr);
console.timeEnd("nonredundant4");
console.log(nonredundant4);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

5. Use sort to sort and remove duplicates

function unique(arr) {
    arr = arr.sort()
    var arrry = [arr[0]];
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] !== arr[i - 1]) {
            arrry.push(arr[i]);
        }
    }
    return arrry;
}
 
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
console.time("nonredundant5");
var nonredundant5 = unique(arr);
console.timeEnd("nonredundant5");

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

6. Use filters

function unique(arr) {
    var obj = {};
    return arr.filter(function(item, index, arr){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
    })
}
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
console.time("nonredundant6");
var nonredundant6 = unique(arr);
console.timeEnd("nonredundant6");
console.log(nonredundant6);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

7. Use Map data structure to remove duplicates

function unique(arr) {
    let map = new Map();
    let array = new Array(); // Array is used to return results for (let i = 0; i < arr.length; i++) {
        if (map.has(arr[i])) { // If there is a key value map.set(arr[i], true);
        } else {
            map.set(arr[i], false); // If there is no such key value array.push(arr[i]);
        }
    }
    return array;
}
 
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
console.time("nonredundant7");
var nonredundant7 = unique(arr);
console.timeEnd("nonredundant7");
console.log(nonredundant7);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

8. Use reduce and include to remove duplicates

function unique(arr){
    return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
var arr = ['qiang', 'ming', 'tao', 'li', 'liang', 'you', 'qiang', 'tao'];
console.time("nonredundant8");
var nonredundant8 = unique(arr);
console.timeEnd("nonredundant8");
console.log(nonredundant8);

The results are as follows:

8 commonly used JavaScript array deduplication practical source code "practical dry goods"

This concludes this article about the practical source code of commonly used JavaScript array deduplication. For more relevant js array deduplication content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!

You may also be interested in:
  • In-depth study of JavaScript array deduplication problem
  • JavaScript array deduplication solution
  • Detailed explanation of several methods of deduplication in Javascript array
  • Detailed explanation of JavaScript array deduplication
  • Examples and comparison of 3 methods for deduplication of JS object arrays
  • js converts a multidimensional array into a one-dimensional array and then reorders it
  • Detailed discussion of several methods for deduplicating JavaScript arrays

<<:  Detailed explanation of the use and precautions of crontab under Linux

>>:  Tutorial on installing MYSQL5.7 from OEL7.6 source code

Recommend

Vue component to realize carousel animation

This article example shares the specific code of ...

mysql batch delete large amounts of data

mysql batch delete large amounts of data Assume t...

Detailed example of clearing tablespace fragmentation in MySQL

Detailed example of clearing tablespace fragmenta...

Detailed explanation of the use of React list bar and shopping cart components

This article example shares the specific code of ...

MySQL PXC builds a new node with only IST transmission (recommended)

Demand scenario: The existing PXC environment has...

Page Refactoring Skills - Content

Enough of small talk <br />Based on the lar...

MySQL 8.0.11 installation tutorial with pictures and text

There are many tutorials on the Internet, and the...

Native js to realize bouncing ball

On a whim, I wrote a case study of a small ball b...

How to change the tomcat port number in Linux

I have several tomcats here. If I use them at the...

React configuration px conversion rem method

Install related dependencies npm i lib-flexible -...

RHCE installs Apache and accesses IP with a browser

1. at is configured to write "This is a at t...

How to deploy ElasticSearch in Docker

1. What is ElasticSearch? Elasticsearch is also d...

mysql three tables connected to create a view

Three tables are connected. Field a of table A co...