前端算法:数组去重

作为一个有经验的前端开发工程师,别总是吹自己在技术栈方面有多么多么深的理解,技术栈运用再怎么炉火纯青,其底层也都是一行一行的javascript代码,所以,基础才是重中之重,以下是基础之数组去重:

1、最简单之去重Array.from() + new Set()

let unduplicate = (arr) => {
    return Array.from(new Set(arr))
}

解释:

  • Array.form 是将数组或者类数组(必须有length)转化为真整的数组,Array.from(arr, function, this)接收三个参数:
  • arr: 要转换的数据,为一个数组或者是类数组(必须有length)
  • Function:回调函数,可以对数据中的元素做一些操作
  • this:执行回调函数 mapFn 时 this 对象
  • 其返回值是一个新数组
     

Array.from()的一些用法:

(1)将字符串转化为数组

    Array.from(‘abcdefg’) => [‘a’, ‘b’, ‘c’, ‘d’, ‘e’,  ‘f’, ‘’g]

(2)初始化一个数组       

let length = 3, init = 0
Array.from({length}, () => init) => [0,0,0]

(3)实现数组的钱拷贝

 Array.from([1,2,3,4]) => [1,2,3,4]

(4)生成一个数字范围

 Array.from({length: 3}, (arr, index) => index) => [1,2,3] 

 

2、.map()/.filter()/.forEach()/.every()/.some() + .indexOf/includes()   

let undeplicate = (arr) => {
    let array = Array.of()
    arr.map(item => {
        if(array.indexOf(item) === -1) {
            array.push(item)
        }
    })
    return array
}

解释:
            主要使用了遍历+查找的方式

.map()/.filter()/.forEach()/.every()/.some()的不同:

 

 

map

filter

forEach

every

some

定义

对数组中的每一项运行给定函数

返回值

返回一个新数组

返回该函数会返回true的项组成的数组

无返回值

如果该函数对每一项返回true,则返回true

如果该函数对任一项返回true,则返回true

 

 

 

3.for循环双层遍历

let undeplicate = (arr) => {
    let array = Array.of()
    for(let i = 0; i < arr.length;i++) {
        let isIn = true
        for(let a = 0;a < array.length; a++) {
            if (arr[i] !== array[a]) {
                isIn = false
            }
        }
        if(!isIn) {
            array.push(arr[i])
        }
     }
}

4、利用排序sort() 

let unduplicate = (arr) => {
    arr = arr.sort()
    let array = Array.of()
    for(let i=0;i<arr.length;i++) {
        if (arr[i] !== arr[i-1]) {
            array.push(arr[i])
        }
    }
    return array
}

 

5、hasOwnProperty

let unduplicate = (arr) => {
    let obj = {};
    return arr.filter(function(item){
        return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item +  item] = true)

    })
}

6、利用reduce+includes

   

let unduplicate = (arr) => {
    return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[])
}

解释:

         reduce简介:array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数

描述

total

必需。初始值, 或者计算结束后的返回值。

currentValue

必需。当前元素

currentIndex

可选。当前元素的索引

arr

可选。当前元素所属的数组对象。

initialValue可选。传递给函数的初始值

reducede 用法:

(1)数组扁平化   

let arr = [[0, 1], [2, 3], [4, 5]]      // 二维数组
let newArr = arr.reduce((pre,cur) => {
    return pre.concat(cur)              // 合并pre 与 cur, 并返回一个新数组
},[])
console.log(newArr);

(2)字符统计/单词统计同理 

str.split('').reduce((res, cur) => {
    res[cur] ? res[cur] ++ : res[cur] = 1
        return res
}, {})

(3)将字符串转换为整数

let str = "4321"
let strParseInt = str.split('').map(item => {return item.charCodeAt() - 48}) .reduce((a, b) => {return a * 10 + b})  

(4)求最大值(最小值同理)   

let arr = [23,123,342,12];
let max = arr.reduce((pre,cur,index,arr) => {
    return pre > cur ? pre : cur
});

(5)求加法(乘法同理)     

let arr = [1, 2, 3, 4, 5];
arr.reduce((sum, curr) => sum + curr, 0); 

注:注重基础,才能有提升,这里都是reduce比较简单的用途,请期待未来reduce的高阶内容。

数组去重的方法远不止这些,能写出一俩种即可,重要的是要理解其原理,代码千篇一律,思想万里挑一,你就是你,你是不一样的烟火。。。。。。。。。

 

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值