工具函数 ~

本文提供了一系列JavaScript实用函数,包括防抖和节流技术用于性能优化,深拷贝实现对象复制,生成区间内的随机数,处理电话号码的隐私,以及多种数组操作方法如去重、冒泡排序、计算元素出现次数、获取最大值、交集和差集的计算等。
摘要由CSDN通过智能技术生成

防抖


```typescript
function throttle(fn: () => unknown, delay: number = 300) {
    let timer: number | null
    return function () {
        if (timer) {
            clearInterval(timer)
        }
        timer = setTimeout(() => {
            fn.apply(this, arguments)
            timer = null
        }, delay)
    }
}

节流

function throttle(fn: () => unknown, delay: number = 300) {
    let timer: number | null
    return function () {
        if (timer) {
            return
        }
        timer = setTimeout(() => {
            fn.apply(this, arguments)
            timer = null
        }, delay)
    }
}

深拷贝

export function deepClone(obj = {}) {
    // 递归
    if (typeof obj !== 'object' || obj == null) {
        return obj
    }
    let result = obj instanceof Array ? [] : {}
    for (let key in obj) {
        // 保证[key]非原型属性
        if (obj.hasOwnProperty(key)) {
            result[key] = deepClone(obj[key]) // 递归
        }
    }
    return result
}

区间内的随机数

const setNumberRange = (m: number, n: number) => {
    return Math.floor(Math.random() * (n - m + 1) + m)
}

电话号码中间4位隐藏

const hideMiddleTel = (tel: string | number) => {
 	if (tel.length > 13) return tel
    if (typeof tel === 'number') {
        tel = tel.toString()
    }
    return tel.slice(0, 3) + tel.slice(-4).padStart(tel.length - 3, '*')
}

判断数组中元素出现多少次

const calcTimes = <T>(arr: T[], val: T) => {
    const count = arr.reduce((prev, cur) => {
        return cur === val ? prev + 1 : prev
    }, 0)
    return count
}

获取数组中最大的数字

const getMaxNumberForArr = (arr: number[]) => {
    return arr.reduce((prev, cur) => {
        return Math.max(prev, cur)
    })
}

数组去重 indexof

function arrDedup(arr: Array<string | number>) {
    const res: Array<string | number> = []
    arr.forEach(item => {
        if (res.indexOf(item) < 0) {
            res.push(item)
        }
    })
    return res
}

数组去重 reduce

const arrDedupReduce = (arr: Array<string | number>) => {
    return arr.reduce(
        function (prev, cur) {
            prev.indexOf(cur) === -1 && prev.push(cur)
            return prev
        },
        [arr[0]]
    )
}

数组去重 Set

const arrDedupSet = (arr: Array<string | number>) => {
    return [...new Set(arr)]
}

数组去重 冒泡

function dedup(arr: Array<string | number> = []) {
    let t: Array<string | number> = [] // 创建新数组
    t[0] = arr[0] // 让新数组有长度
    for (var i = 0; i < arr.length; i++) {
        for (var k = 0; k < t.length; k++) {
            if (t[k] === arr[i]) {
                break
            }
            // 拿到原数组某个元素比较到新数组中的最后一个元素没有重复
            if (k === t.length - 1) {
                t.push(arr[i])
            }
        }
    }
    return t
}

冒泡排序

function bubbleSort(array: number[]) {
    const arr = array
    for (var i = 0; i < arr.length - 1; i++) {
        for (var j = 0; j < arr.length - 1; j++) {
            if (arr[j] > arr[j + 1]) {
                var temp = arr[j]
                arr[j] = arr[j + 1]
                arr[j + 1] = temp
            }
        }
    }
    return arr
}

交集 set

const interSet = (arr1: Array<string | number>, arr2: Array<string | number>) => {
    return [...new Set(arr1)].filter(item => arr2.includes(item))
}

交集 map

const calcInterMap = (arr1: Array<string | number>, arr2: Array<string | number>) => {
    const map = new Map()
    const res = []
    arr1.forEach(n => {
        map.set(n, true)
    })
    arr2.forEach(n => {
        if (map.get(n)) {
            res.push(n)
            map.delete(n)
        }
    })
    return res
}

差集

const calcDiffSet = (arr1: Array<string | number>, arr2: Array<string | number>) => {
    const diff1 = arr1.filter(item => !new Set(arr2).has(item))
    const diff2 = arr2.filter(item => !new Set(arr1).has(item))
    return [...new Set(diff1), ...new Set(diff2)]
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值