There are many methods of array de duplication. Next, let's talk about several common methods:

1, includes method + for loop

The includes() method is used to determine whether an array contains a specified value. According to the situation, if it does, it returns ， true; otherwise, ， false

const array = [1,2,3,2,4,6,3,1, undefined, NaN, 'NAN', null, true, 'true', false, 'false', NaN, undefined];

const unique = (arr) => {
    // Determine whether it is an array
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return;
    }
    
    let newArr = [];
    for (let i = 0; i < arr.length; i++) {
        // Judge whether the newArr contains the arr[i] field
        if (!newArr.includes(arr[i])) {
            newArr.push(arr[i]);
        }
    }
    return newArr;
}

unique(array);
// [1, 2, 3, 4, 6, undefined, NaN, 'NAN', null, true, 'true', false, 'false']

The principle is very simple, mainly in two steps:

1. Judge whether it is an array or not, and return it directly; If it is an array, go to the next step;
2. Traverse the array passed in. If the field is not included in newArr, add the field to newArr, and finally return newArr.

In addition, it is also possible to use indexOf, which will not be discussed here.

The indexOf() method returns the first index of a given element that can be found in the array. If it does not exist, it returns - 1.

2, Map structure + for loop

I have written an article about the usage of has and set in Map before. You can refer to it step by step Map data structure.

This method is similar to the above includes.

const array = [1,2,3,2,4,6,3,1, undefined, NaN, 'NAN', null, true, 'true', false, 'false', NaN, undefined];

const unique = (arr) => {
    let map = new Map();
    let newArr = new Array(); 
    for (let i = 0; i < arr.length; i++) {
        // Judge whether arr[i] already exists
        if(!map.has(arr[i])) {  
            map.set(arr[i], true); 
            newArr.push(arr[i]);
        }
    } 
    return newArr ;
}

unique(array);
// [1, 2, 3, 4, 6, undefined, NaN, 'NAN', null, true, 'true', false, 'false']

3, Array from + set

The Set object allows you to store unique values of any type, whether Original value Or object references. In other words, the elements in the Set will only appear once, that is, the elements in the Set are unique.

Array. The from () method creates a new, shallow copy of an array instance of a similar array or iteratable object.

const array = [1,2,3,2,4,6,3,1, undefined, NaN, 'NAN', null, true, 'true', false, 'false', NaN, undefined];

const unique = (arr) => {
    return Array.from(new Set(arr));
}

unique(array);
// [1, 2, 3, 4, 6, undefined, NaN, 'NAN', null, true, 'true', false, 'false']

Here, Set is an array of classes, while array The purpose of from here is to convert it into an array.

IV. extension operator + set

const array = [1,2,3,2,4,6,3,1, undefined, NaN, 'NAN', null, true, 'true', false, 'false', NaN, undefined, {}, {}];

const unique = (arr) => {
    return [...new Set(arr)];
}

unique(array);
// [1, 2, 3, 4, 6, undefined, NaN, 'NAN', null, true, 'true', false, 'false']

In fact, similar to the third method, the purpose of the extension operator here is to convert the class array into an array.

It is worth noting that the above methods are not applicable to reference types, such as objects. The above methods do not remove duplication.

In short, there are two main ideas for array de duplication:

1. Double loop (such as: includes, indexOf)

2. Non repeatability of method keys (such as Set and Map)

Of course, there are many methods. Here are only a few common ones.

If there is anything wrong or other methods, please add and share in the comment area!