狠狠色丁香婷婷综合尤物/久久精品综合一区二区三区/中国有色金属学报/国产日韩欧美在线观看 - 国产一区二区三区四区五区tv

在JavaScript中，去除數(shù)組中重復(fù)元素的需求十分常見(jiàn)，下面詳細(xì)介紹并演示七種不同的去重方法，每種方法都會(huì)附帶必要的代碼注釋。

1. 使用ES6的Set結(jié)構(gòu)

Set是一種集合數(shù)據(jù)結(jié)構(gòu)，它不允許有重復(fù)的元素。通過(guò)擴(kuò)展運(yùn)算符...可以輕松地將Set轉(zhuǎn)換回?cái)?shù)組，從而達(dá)到去重的目的。

// 原始數(shù)組
const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

// 定義去重函數(shù)
function removeDuplicatesWithSet(arr) {
    // 創(chuàng)建一個(gè)Set，自動(dòng)去除重復(fù)元素
    const uniqueSet = new Set(arr);
    // 使用擴(kuò)展運(yùn)算符將Set轉(zhuǎn)換為數(shù)組
    const uniqueArray = [...uniqueSet];
    return uniqueArray;
}

// 調(diào)用函數(shù)并打印結(jié)果
const result = removeDuplicatesWithSet(arr);
console.log(result);

2. 使用filter()方法

filter()方法會(huì)創(chuàng)建一個(gè)新數(shù)組，其結(jié)果是通過(guò)提供的函數(shù)實(shí)現(xiàn)數(shù)組中的每個(gè)元素的篩選。

const arr = ['apple', 'apps', 'pear', 'apple', 'orange', 'apps'];

function removeDuplicatesWithFilter(arr) {
    // 使用filter方法，只有當(dāng)元素的索引和元素首次出現(xiàn)的位置相同時(shí)，才保留該元素
    return arr.filter((item, index) => arr.indexOf(item) === index);
}

const result = removeDuplicatesWithFilter(arr);
console.log(result);

3. 使用for循環(huán)和indexOf()

這種方法遍歷數(shù)組，使用indexOf()檢查元素是否已經(jīng)存在于結(jié)果數(shù)組中。

const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

function removeDuplicatesWithFor(arr) {
    const uniqueArray = []; // 初始化一個(gè)空數(shù)組用于存放唯一元素
    for (let i = 0; i < arr.length; i++) {
        // 如果元素尚未在uniqueArray中出現(xiàn)，則添加之
        if (uniqueArray.indexOf(arr[i]) === -1) {
            uniqueArray.push(arr[i]);
        }
    }
    return uniqueArray;
}

const result = removeDuplicatesWithFor(arr);
console.log(result);

4. 雙重for循環(huán)去重

盡管這種方法可以工作，但它效率低下，不推薦使用，尤其是對(duì)于大型數(shù)組。

const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

function removeDuplicatesWithDoubleFor(arr) {
    for (let i = 0; i < arr.length; i++) {
        for (let j = i + 1; j < arr.length; j++) {
            // 當(dāng)找到重復(fù)元素時(shí)，從數(shù)組中移除它
            if (arr[i] === arr[j]) {
                arr.splice(j, 1);
                j--; // 由于splice改變了數(shù)組長(zhǎng)度，所以需要減一以保持正確的索引
            }
        }
    }
    return arr;
}

const result = removeDuplicatesWithDoubleFor(arr);
console.log(result);

5. 使用indexOf()與新數(shù)組

這種方法檢查元素在原始數(shù)組中的首次出現(xiàn)位置，如果該位置與當(dāng)前索引匹配，則添加到新數(shù)組中。

const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

function removeDuplicatesWithIndexOf(arr) {
    const uniqueArray = [];
    for (let i = 0; i < arr.length; i++) {
        // 只有當(dāng)元素首次出現(xiàn)時(shí)才添加到uniqueArray中
        if (arr.indexOf(arr[i]) === i) {
            uniqueArray.push(arr[i]);
        }
    }
    return uniqueArray;
}

const result = removeDuplicatesWithIndexOf(arr);
console.log(result);

6. 使用includes()方法

includes()方法檢查數(shù)組中是否存在指定的值，如果存在則返回true，否則返回false。

const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

function removeDuplicatesWithIncludes(arr) {
    const uniqueArray = [];
    for (let i = 0; i < arr.length; i++) {
        // 如果uniqueArray中不包含當(dāng)前元素，則添加之
        if (!uniqueArray.includes(arr[i])) {
            uniqueArray.push(arr[i]);
        }
    }
    return uniqueArray;
}

const result = removeDuplicatesWithIncludes(arr);
console.log(result);

7. 使用reduce()方法

reduce()方法對(duì)數(shù)組中的每個(gè)元素執(zhí)行一個(gè)由您提供的reducer函數(shù)，將其結(jié)果匯總為單個(gè)返回值。

const arr = [1, 9, 8, 8, 7, 2, 5, 3, 3, 3, 2, 3, 1, 4, 5, 444, 55, 22];

function removeDuplicatesWithReduce(arr) {
    // reducer函數(shù)，檢查acc（累加器）中是否已經(jīng)包含當(dāng)前元素，如果沒(méi)有，則添加
    return arr.reduce((acc, curr) => {
        if (!acc.includes(curr)) {
            acc.push(curr);
        }
        return acc;
    }, []);
}

const result = removeDuplicatesWithReduce(arr);
console.log(result);

每種方法都有其適用場(chǎng)景和性能特點(diǎn)，選擇最適合的方法取決于具體的項(xiàng)目需求和環(huán)境。通常，使用ES6的Set或filter()方法是最佳選擇，因?yàn)樗鼈兗群?jiǎn)潔又高效。