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

Solution to invalid Nginx cross-domain setting Access-Control-Allow-Origin

nginx version 1.11.3 Using the following configur...

Install Linux using VMware virtual machine (CentOS7 image)

1. VMware download and install Link: https://www....

Examples of correct judgment methods for data types in JS

Table of contents Preface Can typeof correctly de...

Mysql practical exercises simple library management system

Table of contents 1. Sorting function 2. Prepare ...

HTML head structure

The following introduces the commonly used head s...

Some notes on mysql self-join deduplication

Let me briefly explain the functional scenario: T...

Detailed explanation of three ways to cut catalina.out logs in tomcat

1. Log4j for log segmentation 1) Prepare three pa...

Solve the problem of MySql client exiting in seconds (my.ini not found)

Problem description (environment: windows7, MySql...

Import CSS files using judgment conditions

Solution 1: Use conditional import in HTML docume...

HTML form tag tutorial (2):

This tutorial introduces the application of vario...

MySQL 8.0.11 compressed version installation tutorial

This article shares the installation tutorial of ...

MySQL single table query example detailed explanation

1. Prepare data The following operations will be ...

Detailed explanation of basic data types in mysql8.0.19

mysql basic data types Overview of common MySQL d...