js中字符串数组去重常用方法

摘要:在Js中,如果你有一个数组,其中包含字符串,并且你想要去除重复的字符串(即数组去重),有几种方法可以实现。这里我将介绍几种常见的方法:

在Js中,如果你有一个数组,其中包含字符串,并且你想要去除重复的字符串(即数组去重),有几种方法可以实现。这里我将介绍几种常见的方法:


方法 1:使用 Set

Set 是 ES6 引入的数据结构,它天然去重。将数组转换为 Set,再转换回数组即可。

const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'grape'];

// 使用 Set 去重
const uniqueArr = [...new Set(arr)];

console.log(uniqueArr); // 输出: ['apple', 'banana', 'orange', 'grape']


方法 2:使用 filter 和 indexOf

通过 filter 和 indexOf 结合,保留第一次出现的元素。

const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'grape'];

// 使用 filter 和 indexOf 去重
const uniqueArr = arr.filter((item, index) => arr.indexOf(item) === index);

console.log(uniqueArr); // 输出: ['apple', 'banana', 'orange', 'grape']


方法 3:使用 reduce

通过 reduce 遍历数组,将不重复的元素添加到新数组中。

const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'grape'];

// 使用 reduce 去重
const uniqueArr = arr.reduce((acc, item) => {
    if (!acc.includes(item)) {
        acc.push(item);
    }
    return acc;
}, []);

console.log(uniqueArr); // 输出: ['apple', 'banana', 'orange', 'grape']


方法 4:使用 forEach 和对象(或 Set)去重

通过遍历数组,利用对象或 Set 的特性去重。

const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'grape'];

// 使用 forEach 和对象去重
const uniqueArr = [];
const seen = {};

arr.forEach(item => {
    if (!seen[item]) {
        seen[item] = true;
        uniqueArr.push(item);
    }
});

console.log(uniqueArr); // 输出: ['apple', 'banana', 'orange', 'grape']


方法 5:使用 reduce 和 Set(结合方法 1 和方法 3)

结合 reduce 和 Set,代码更简洁。

const arr = ['apple', 'banana', 'apple', 'orange', 'banana', 'grape'];

// 使用 reduce 和 Set 去重
const uniqueArr = arr.reduce((acc, item) => {
    acc.add(item);
    return acc;
}, new Set());

console.log([...uniqueArr]); // 输出: ['apple', 'banana', 'orange', 'grape']


总结

  • 推荐方法:使用 Set(方法 1),因为它最简单且性能较好。

  • 兼容性:如果需要兼容老版本浏览器,可以使用 filter 和 indexOf(方法 2)。

  • 灵活性:如果需要更复杂的去重逻辑,可以使用 reduce(方法 3 或方法 5)。

  • 性能:对于非常大的数组,Set 和对象(方法 1 和方法 4)的性能通常更好。

选择适合你场景的方法即可!


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://shenqiku.cn/article/FLY_12720