10 effective methods for js array deduplication vue array deduplication

Method One
Idea: Define a new array and store the first element of the original array, then compare the element group with the elements of the new array one by one, and store it in the new array if they are different.

function unique(arr) {
    
    
    let newArr = [arr[0]];
    for (let i = 1; i < arr.length; i++) {
    
    
        let repeat = false;
        for (let j = 0; j < newArr.length; j++) {
    
    
            if (arr[i] === newArr[j]) {
    
    
                repeat = true;
                break;
            }else{
    
    
                
            }
        }
        if (!repeat) {
    
    
            newArr.push(arr[i]);
        }
    }
    return newArr;
}
 
console.log(unique([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3, 5, 6, 7, 4]

Scan the code to view 1,000 front-end questions for freeInsert picture description here

Method 2
Idea: Sort the original array first, compare it with the adjacent ones, and store them in the new array if they are different.

function unique2(arr) {
    
    
    var formArr = arr.sort()
    var newArr=[formArr[0]]
    for (let i = 1; i < formArr.length; i++) {
    
    
        if (formArr[i]!==formArr[i-1]) {
    
    
            newArr.push(formArr[i])
        }
    }
    return newArr
}
console.log(unique2([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3,  4,5, 6, 7]

Method 3: Make
use of the existing characteristics of the object property, if there is no such property, store it in a new array.

function unique3(arr) {
    
    
    var obj={
    
    }
    var newArr=[]
    for (let i = 0; i < arr.length; i++) {
    
    
        if (!obj[arr[i]]) {
    
    
            obj[arr[i]] = 1
            newArr.push(arr[i])
        }   
    }
    return newArr
}
console.log(unique2([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3, 5, 6, 7, 4]

Method 4: Use the indexOf subscript property of the array to query.

function unique4(arr) {
    
    
    var newArr = []
    for (var i = 0; i < arr.length; i++) {
    
    
        if (newArr.indexOf(arr[i])===-1) {
    
    
            newArr.push(arr[i])
        }
    }
    return newArr
}
console.log(unique4([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3, 5, 6, 7, 4]

Method 5: Use the includes method on the array prototype object.

 function unique5(arr) {
    
    
        var newArr = []
        for (var i = 0; i < arr.length; i++) {
    
    
            if (!newArr.includes(arr[i])) {
    
    
                newArr.push(arr[i])
            }
        }
        return newArr
    }
    console.log(unique5([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
    // 结果是[1, 2, 3, 5, 6, 7, 4]

Method 6: Use the filter and includes methods on the array prototype object.


```javascript
  function unique6(arr) {
    
    
        var newArr = []
        newArr = arr.filter(function (item) {
    
    
            return newArr.includes(item) ? '' : newArr.push(item)
        })
        return newArr
    }
    console.log(unique6([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
    // 结果是[1, 2, 3, 5, 6, 7, 4]

Method 7: Use the forEach and includes methods on the array prototype object.

  function unique7(arr) {
    
    
    let newArr = [];
    arr.forEach(item => {
    
    
        return newArr.includes(item) ? '' : newArr.push(item);
    });
    return newArr;
}
console.log(unique7([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3, 4, 5, 6, 7]

Method 8: Use the splice method on the array prototype object.

function unique8(arr) {
    
    
    var 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;
}
console.log(unique8([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));

Method 9: Use the lastIndexOf method on the array prototype object.

 function unique9(arr) {
    
    
        var res = [];
        for (var i = 0; i < arr.length; i++) {
    
    
            res.lastIndexOf(arr[i]) !== -1 ? '' : res.push(arr[i]);
        }
        return res;
    }
    console.log(unique9([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
    // 结果是[1, 2, 3, 5, 6, 7, 4]

Method 10: Use the set method of ES6.

function unique10(arr) {
    
    
    //Set数据结构,它类似于数组,其成员的值都是唯一的
    return Array.from(new Set(arr)); // 利用Array.from将Set结构转换成数组
}
console.log(unique10([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
// 结果是[1, 2, 3, 5, 6, 7, 4]

Guess you like

Origin blog.csdn.net/weixin_42981560/article/details/109022273