常用功能函数封装

150 阅读2分钟

前言

之前在工作中经常去写一些重复的功能逻辑(当时以为用的地方较少就没去对该功能进行封装),后面在code review 时发现很多地方都用到了所以又花时间去抽离封装,这样对个人来说花费了很多不必要的时间,所以在后面开发中将一些常用的功能函数放到一个文件中,其他文件中按需调用即可。

1.获取身份证信息

一般身份证信息主要是获取出生日期、性别、年龄等信息。

/**
 * @param idCard [String] 身份证
 * @param type [Number] 解析类型 0:个人信息对象 1:出生日期 2:性别 3:年龄
 */
function formatCard(idCard, type){
    let personInfo = {};
    let yy = idCard.substring(6,10)
    let mm = idCard.substring(10,12)
    let dd = idCard.substring(12,14)
    let birthday = `${yy}-${mm}-${dd}`
    let gender = idCard.substr(16, 1) % 2 === 1 ? '男' : '女'
    let nowDate = new Date()
    let month = nowDate.getMonth() + 1
    let day = nowDate.getDate()
    let age = nowDate.getFullYear() - yy - 1
    // 当前月份大于身份证月份或者当前月份等于身份证月份并且当前日期大于等于身份证日期时年龄+1
    if(mm < month || mm === month && dd <= day){
        age++
    }
    personInfo.birthday = birthday;
    personInfo.gender = gender;
    personInfo.age = age;
    switch (type){
        case 0:
            return personInfo;
        case 1:
            return birthday;
        case 2:
            return gender;
        case 3:
            return age;
    }
}

2.闰年判断 & 根据年月获取当月天数

判断方法:年份是4的倍数且不是100的倍数或者是400的倍数。

/***
 * @param year 年份
 * @returns {boolean}
 */
function isLeapYear(year){
    if(year % 4 === 0 && year % 100 !== 0){
        return true
    }else return year % 400 === 0
}
/***
 * @param year 年份
 * @param month 月份
 * @returns {number} 天数
 */
function getDayWidthYear(year, month){
    const flag = isLeapYear(year)
    switch(month){
        case 1:
        case 3:
        case 5:
        case 7:
        case 8:
        case 10:
        case 12:
            return 31;
        case 4:
        case 6:
        case 9:
        case 11:
            return 30;
        case 2:
           if(flag){
               return 29
           }else{
               return 28
           }
    }
}

3.生成范围内的随机数 & 生成随机颜色

/***
 * @param min 最小值
 * @param max 最大值
 * @returns {*}
 */
function getRandomNum(min, max){
    return Math.floor(Math.random() * (max - min + 1)) + min
}
function getRandomColor(){
    return '#' + Math.floor(Math.random() * 0xffffff).toString(16)

   //  let r = Math.floor(Math.random() * 255)
   //  let g = Math.floor(Math.random() * 255)
   //  let b = Math.floor(Math.random() * 255)
   // return `rgb(${r},${g},${b})`
}

4.数字格式化(超过一定范围用+表示)

页面在显示数据时有时需要对显示数字进行格式化,比如消息超过99条就显示:99+

function numberDefine(val, maxNum) {
    val = val ? val - 0 : val;
    if (val > maxNum) {
        return `${maxNum}+`
    } else {
        return val + ''
    }
}

5.函数防抖 & 函数节流

/**
 * @param { function } func 要执行的方法
 * @param { number } wait 延迟执行毫秒数
 * @param { boolean } immediate  true 表立即执行,false 表非立即执行
 */
function debounce(func, wait, immediate) {
    let timeout;
    return function () {
        let context = this;
        let args = arguments;

        if (timeout) clearTimeout(timeout);
        if (immediate) {
            let callNow = !timeout;
            timeout = setTimeout(() => {
                timeout = null;
            }, wait);
            if (callNow) func.apply(context, args)
        } else {
            timeout = setTimeout(() => {
                func.apply(context, args)
            }, wait);
        }
    }
}
/**
 * @param { function } func 要执行的方法
 * @param { number } wait 延迟执行毫秒数
 * @param { number } type 1 表时间戳版,2 表定时器版
 */
function throttle(func, wait, type) {
    let previous, timeout;
    if (type === 1) {
        previous = 0;
    } else if (type === 2) {
        timeout = null;
    }
    return function () {
        let context = this;
        let args = arguments;
        if (type === 1) {
            let now = Date.now();

            if (now - previous > wait) {
                func.apply(context, args);
                previous = now;
            }
        } else if (type === 2) {
            if (!timeout) {
                timeout = setTimeout(() => {
                    timeout = null;
                    func.apply(context, args)
                }, wait)
            }
        }
    }
}