资讯专栏INFORMATION COLUMN

好像不是最全的数组去重方法

AnthonyHan / 2123人阅读

摘要:最简单粗暴地方式,两重循环两个因为两个因为排序,如果相同就会挨着先放数组第一个元素无法判断对象对象数组去重方法补充我想说一下与相同点他们都是用来遍历数组的。不同点能有返回值,没有返回值。

这一篇文章,我们讲解一下数组去重。

1.最简单粗暴地方式,两重for循环

let arr = [9, 5, 6, 5, "1", "1", true, 5, true];
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);
        }       
    }
}
console.log(arr); // [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]
// 两个NaN, 因为NaN!=NaN

2.indexOf

let a = [];
for (var i = 0; i < arr.length; i++) {
    if(a.indexOf(arr[i]) === -1){
        a.push(arr[i]);
    }
}
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]
// 两个NaN, 因为NaN!=NaN

3.includes

for (var i = 0; i < arr.length; i++) {
    if(!a.includes(arr[i])){
        a.push(arr[i]);
    }
}
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, {…}, {…}]

4.Set

let a = [...(new Set(arr))];
console.log(a); // [9, 5, 6, "1", true, undefined, null, NaN, {…}, {…}]

5.filter

let a = arr.filter(function(value, index){
    return arr.indexOf(value, 0) === index;
})
console.log(a);// [9, 5, 6, "1", true, undefined, null, {…}, {…}]
arr.filter(function(value){
    return a.indexOf(value) === -1 ? a.push(value) : a;
})
console.log(a);// [9, 5, 6, "1", true, undefined, null, NaN, NaN, {…}, {…}]

6.sort

arr = arr.sort(); // 排序,如果相同就会挨着
a.push(arr[0]); // 先放数组第一个元素
for (var i = 1; i < arr.length; i++) {
    if(arr[i] !== arr[i - 1]){
        a.push(arr[i]);
    }
}

7.reduce

arr = arr.sort(); 
arr.reduce(function(preVal, nowVal){
    if(preVal !== nowVal){
        a.push(preVal);
    }
    return nowVal;
}, a)
arr.reduce(function(preVal, nowVal){
    return a.indexOf(nowVal) === -1 ? a.push(nowVal) : a;
}, a)
console.log(a); //["1", 5, 6, 9, NaN, NaN, {…}, {…}, null, true, undefined]

8.hasOwnProperty

let obj = {};
for (var i = 0; i < arr.length; i++) {
    if(!obj.hasOwnProperty(obj[typeof arr[i] + arr[i]])){
        obj[typeof arr[i] + arr[i]] = arr[i];
    }
}
console.log(Object.values(obj)); //[9, 5, 6, "1", true, undefined, null, NaN, {…}] 无法判断对象

9.对象数组去重方法

let obj = {};
for (var i = 0; i < arr.length; i++) {
    if(!obj[typeof arr[i] + arr[i]]){
        obj[typeof arr[i] + arr[i]] = arr[i];
    }
}
console.log(Object.values(obj)); //[9, 5, 6, "1", true, undefined, null, NaN, {…}]

10.Map

let map = new Map();
for (var i = 0; i < arr.length; i++) {
    if(!map.get(arr[i])){
        map.set(arr[i], arr[i]);
    }
}
console.log(map);

补充

我想说一下forEach与map

arr.forEach( function(element, index) {
    console.log(element);
});
arr.map(function(element, index){
    console.log(element);
});

相同点

他们都是用来遍历数组的。

不同点

map能有返回值,forEach没有返回值。

let arr = [9,3,6,3,6,3];
arr = arr.forEach( function(element, index) {
    return element + 1;
});
console.log(arr); // undefined
arr = arr.map(function(element, index){
    return element + 1;
});
console.log(arr); //[10, 4, 7, 4, 7, 4]

forEach不能中途打断

let arr = [9,3,6,3,6,3];
arr.forEach( function(element, index) {
    console.log(element);
    if(index === 2){
        return; //没用,break,continue会报错是无效的
    }
});

forEach模拟实现

Array.prototype.bforEach = function (fn) {
    let array = this;
    for (var i = 0; i < array.length; i++) {
        fn(array[i], i, array);
    }
}
arr.bforEach(function(element, index){
    console.log(element); // 9, 3, 6, 3, 6, 3
});

map模拟实现

Array.prototype.Map = function (fn) {
    let array = this,
        a = [],
        r;
    for (var i = 0; i < array.length; i++) {
        r = fn(array[i], i, array);
        a.push(r);
    }
    return a;
}

喜欢的可以点一个赞,或者关注一下。鼓励一下一名自学前端的大学生。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100700.html

相关文章

  • JavaScript数组去重(12种方法,史上最全

    摘要:数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码。如果是被提问到,数组去重的方法有哪些你能答出其中的种,面试官很有可能对你刮目相看。数组去重的方法一利用去重中最常用不考虑兼容性,这种去重的方法代码最少。 数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码。如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看...

    rozbo 评论0 收藏0
  • 最全数组去重方法对比

    摘要:本文最早发布于,为原创常规方法两种数组深拷贝,为不了影响原来的数组第一种方法常用但是有坑碰到这种情况就出问题了第二种方法使用,方法返回的结果并不一定是升序,主要目的是将重复的数字排到一起使用的方法两种简洁优雅版奇技淫巧更新看到评论 本文最早发布于csdn,为原创 常规方法两种 let json = arr => { let res = [], obj = {};...

    BlackHole1 评论0 收藏0
  • JS类型判断、对象克隆、数组克隆

    摘要:对象克隆我们经常会用到一个对象去做一些事情,可能有时候我们不想改变原有的数据。如果是对象接着递归复制判断是对象还是数组其实这还不是最终的深克隆,因为这一个也有它自己的问题,但是面对一般的情况应该没问题,跟高级的用法请自行学习。 类型判断 我们先说一下JS的数据类型,我们一般说JS有六大数据类型(ES6以前)分别是: 基本数据类型 Number String Boolean nul...

    dreamtecher 评论0 收藏0
  • js数组去重几种方法

    摘要:三种方法利用判断新数组中实际上也是使用的类似的传入数组如果当前数组的第已经保存进了临时数组,那么跳过,否则把当前项到临时数组里面利用判断旧数组结果数组如果当前数组的第项在当前数组中第一次出现的位置不是,那么表示第项是重复的,忽略掉。 三种方法 利用indexOf判断新数组 underscore.js中实际上也是使用的类似的indexOf //传入数组 functio...

    mykurisu 评论0 收藏0
  • 史上最全 Python 3 类型转换指南

    摘要:支持转换为类型的,仅有,其他类型均不支持。如果中含有正负号数字和小数点以外的字符,则不支持转换。转换时,会自动添加虚数部分并以表示。转换会直接完全转换。转换列表,会取每个字节的十进制值并组合成列表转换为比较简单。 int 支持转换为 int 类型的,仅有 float、str、bytes,其他类型均不支持。 float -> int 会去掉小数点及后面的数值,仅保留整数部分。 int(-...

    libxd 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<