文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

JS数组去重的常用4种方法

2024-04-02 19:55

关注

1.ES6的Set类数组去重

var arr = [1,2,2,3,3,4,4,1,5,6,6,5]
function unique (arr) {
  return Array.from(new Set(arr))
}

console.log(unique(arr))
 //[1,2,3,4,5,6]

ES6的Set是类数组,里面的值是唯一的,但是不是真正的数组所以要通过Array.from()方法转化为数组,不考虑兼容问题是最简单的去重方法

2.for循环嵌套for循环

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];

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]) {          // 判断连个值是否相等
                arr.splice(j, 1);           // 相等删除后者
                j--;
            }
        }
    }
    return arr
}
console.log(unique(arr));

两个for循环加上spliceES5常用的方法
第一个for遍历每个数组项,第二个for循环遍历第一个for循环当前遍历项后面的数组项与第一个for当前数组项作比较,后面存在相等的项,则删除掉此项,并且j要减一,因为删除了一项,所以后面的元素往前移了,所以减一来抵消迁移确保每一项遍历完

3.indexOf去重

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];
function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('错误!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {    // 首次遍历数组
        if (array.indexOf(arr[i]) === -1) {   // 判断索引有没有等于
            array.push(arr[i])
        }
    }
    return array
}
console.log(unique(arr));

indexOf()会判断数组里面是否含有这个值,没有则返回-1,有则返回存在的数组下标值,有多个只返回第一个,不再继续判断
for循环加indexOf,for循环存在newArr里则什么都不做,不存在则加入新数组里,返回新数组

4.利用filter

var arr = [1,2,2,3,3,4,4,1,5,6,6,5];
function unique(arr) {
    return arr.filter( (item, index, arr) => {
        //当前元素,在原始数组中的第一个索引==当前索引值,否则返回当前元素
        return arr.indexOf(item) === index;
    });
}
console.log(unique(arr));

filter加indexOf,判断当前的索引值等不等于indexOf返回的索引值,等于就是同一个数组项,不等于的情况就是当前的item是第二次出现,而indexOf判断出来的下标值还是第一个,这一项则不会返回,所以达到了去重的要求

更多关于JS数组去重的方法请查看下面的相关链接

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     807人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     351人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     314人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     433人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     221人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯