JS，TS 封装开发中经常用到的方法！

 1、数据扁平化（将后端返回的树形数据，转换为同级显示）：

/**
 * @description 扁平化下拉数据
 * @param arr 下拉数据
 * */
export const flatten = (arr: any[]): any[] => {
    return arr.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur.children) ? flatten(cur.children) : cur)
    }, [])
}

2、数组按某个字段排序(升序/降序)，开发中很多时候都需要根据数组对象里的某个字段进行排序，使用以下方法即可：

/**
 * 数组按某个字段排序(升序) PS：降序改为parseInt(b[field]) - parseInt(a[field]))
 * @param arr 数组
 * @param field 需要排序的字段
 * @returns 排序后的数组
 */
export const ArraySort = (arr: any, field: string) => {
    return arr.sort((a: any, b: any) => parseInt(a[field]) - parseInt(b[field]))
}

3、判断一个值是否是不为空的数组（相信开发中都会用到吧，把它封装成方法，随时调用）：

/**
 * 判断一个值是否为数组并且不为空
 * @variable 需要进行判断的值
 * @returns true/false
 */
export const isArrayNotEmpty = (variable: any) => {
    return Array.isArray(variable) && variable.length > 0
}

4、阿拉伯数值转汉字数值：

/**
 * 阿拉伯数值转汉字数值
 * @param number 阿拉伯数值
 * @returns 汉字数值
 */
export const numberToString = (number: number | string) => {
    if (typeof number === 'number') {
        number = String(number)
    }

    if (number.match(/\D/) || number.length >= 14) {
        return
    }

    const zhArray = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十'] // 数字对应中文
    const baseArray = ['', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千', '万'] //进位填充字符，第一位是 个位，可省略

    let string = String(number)
        .split('')
        .reverse()
        .map((item, index) => {
            // 把数字切割成数组并倒序排列，然后进行遍历转成中文
            // 如果当前位为0，直接输出数字， 否则输出 数字 + 进位填充字符
            item =
                Number(item) == 0 ? zhArray[Number(item)] : zhArray[Number(item)] + baseArray[index]
            return item
        })
        .reverse()
        .join('') // 倒叙回来数组，拼接成字符串
    string = string.replace(/^一十/, '十') // 如果以 一十 开头，可省略一
    string = string.replace(/零+/, '零') // 如果有多位相邻的零，只写一个即可

    return string
}

5、判断一个值是否是空的：空字符 或 undefined 或 null:

/**
 * 判断一个值是否是空的：空字符 或 undefined 或 null
 * @param value 要判断的值
 * @returns true/false
 */
export const isEmptyValue = (value: string | number | null | undefined) => {
    return (
        value === undefined || value === null || (typeof value === 'string' && value.trim() === '')
    )
}

6、防抖函数：

/**
 * 防抖函数
 * @param fun 执行的方法
 * @param wait 等待时间
 * @returns
 */
export function debounce(fun: any, wait = 300) {
    let timer: any
    return function (...args: any[]) {
        if (timer) {
            clearTimeout(timer)
        }
        timer = setTimeout(() => {
            fun.call(this, ...args)
        }, wait)
    }
}

7、节流函数：

/**
 * @description 节流函数
 * @param fn 回调函数
 * @param delay 延迟时间
 * */
export function throttle(fn: Function, delay: number) {
    let timer: any = null
    return function (this: Function, ...args: any[]) {
        if (!timer) {
            timer = setTimeout(() => {
                fn.apply(this, args)
                timer = null
            }, delay)
        }
    }
}

8、列表分页数据转成下拉组件可用的格式：

/**
 * 列表分页数据转成下拉组件可用的格式
 * @param arr 列表分页数据
 * @param labelKey 作为label使用的字段名
 * @param valueKey 作为value使用的字段名，默认使用id字段
 * @returns
 */
export const pageToSelect = <valueType = string>(
    arr: any[],
    labelKey: string,
    valueKey = 'id'
): Option<valueType>[] => {
    const res: Option<valueType>[] = []

    arr.map((item: any) => {
        const temp: any = {
            label: item[labelKey],
            value: item[valueKey],
        }
        item.children && (temp.children = pageToSelect(item.children, labelKey, valueKey))

        res.push(temp)
    })

    return res
}

当然，还有很多开发中经常用的方法，先分享这么多吧，下篇继续！欢迎大家评论区分享更多~