前端常用工具类方法

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第 5 天，点击查看活动详情

1. 判断是否是对象

isObject(obj) {
    return typeof obj === 'object' && obj !== null;
}

2. 判断对象是否为空

function isEmptyObject(obj) {
    if (obj.length && obj.length > 0) {
        return false;
    }
    for (let key in obj) {
        if (hasOwnProperty.call(obj, key)) {
            return false;
        }
    }
    return true;
}

3. 比较两个对象是否相等

export function isEqual(x, y) {
    //标识是否相似
    var i, l, left, right;

    function compare2Objects(x, y) {
        var p;

        if (isNaN(x) && isNaN(y) && typeof x === 'number' && typeof y === 'number') {
            return true;
        }

        if (x === y) {
            return true;
        }

        if (
            (typeof x === 'function' && typeof y === 'function') ||
            (x instanceof Date && y instanceof Date) ||
            (x instanceof RegExp && y instanceof RegExp) ||
            (x instanceof String && y instanceof String) ||
            (x instanceof Number && y instanceof Number)
        ) {
            return x.toString() === y.toString();
        }

        if (!(x instanceof Object && y instanceof Object)) {
            return false;
        }

        if (x.isPrototypeOf(y) || y.isPrototypeOf(x)) {
            return false;
        }

        if (x.constructor !== y.constructor) {
            return false;
        }

        if (x.prototype !== y.prototype) {
            return false;
        }

        if (left.indexOf(x) > -1 || right.indexOf(y) > -1) {
            return false;
        }

        for (p in y) {
            if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
                return false;
            } else if (typeof y[p] !== typeof x[p]) {
                return false;
            }
        }

        for (p in x) {
            if (y.hasOwnProperty(p) !== x.hasOwnProperty(p)) {
                return false;
            } else if (typeof y[p] !== typeof x[p]) {
                return false;
            }

            switch (typeof x[p]) {
                case 'object':
                case 'function':
                    left.push(x);
                    right.push(y);

                    if (!compare2Objects(x[p], y[p])) {
                        return false;
                    }

                    left.pop();
                    right.pop();
                    break;

                default:
                    if (x[p] !== y[p]) {
                        return false;
                    }
                    break;
            }
        }

        return true;
    }

    if (arguments.length < 1) {
        return true; 
    }

    for (i = 1, l = arguments.length; i < l; i++) {
        left = [];
        right = [];

        if (!compare2Objects(arguments[0], arguments[i])) {
            return false;
        }
    }

    return true;
}

4. 比较两个数组是否相同

function compareArray(oldArr = [], newArr = [], key = 'id') {
    if (oldArr.length !== newArr.length) return true
    const oldArrString = oldArr.map(item => item[key]).sort().toString()
    const newArrString = newArr.map(item => item[key]).sort().toString()

    return oldArrString !== newArrString;
}

5. 模拟睡眠一段时间

export const sleep = (t) => {
    return new Promise(resolve => {
        setTimeout(() => resolve(), t)
    })
}

6. 如何将浮点数点左边的数每三位添加一个逗号，如 10000000000.12 转化为『10,000,000,000.12』?

// 方法一
function format(number) {
  return number && number.replace(/(?!^)(?=(\d{3})+.)/g, ",");
}
// 方法二
function format1(number) {
  return Intl.NumberFormat().format(number)
}
// 方法三
function format2(number) {
  return number.toLocaleString('en')
}

// 方法四
function fn(number) {
    const temp = String(number).split('.')
    const intNum = temp[0]
    const restNum = temp[1]
    const len = intNum.length
    let i = len % 3
    let num = intNum.slice(0, i)
    for (i; i < len; i = i + 3) {
        const s = i === 0 ? '' : ','
        num += s + intNum.slice(i, i + 3)
    }
    return num + '.' + restNum
}

// fn(1234567.00001) -> 1,234,567.00001

7. 金额转大写

function digitUppercase(price) {
    const fraction = ['角', '分'];
    const digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
    const unit = [
        ['元', '万', '亿'],
        ['', '拾', '佰', '仟'],
    ];
    let isMinus = price < 0;
    let num = Math.abs(price);
    let s = '';
    fraction.forEach((item, index) => {
        s += (digit[Math.floor(num * 10 * (10 ** index)) % 10] + item).replace(/零./, '');
    });
    s = s || '整';
    num = Math.floor(num);
    for (let i = 0; i < unit[0].length && num > 0; i += 1) {
        let p = '';
        for (let j = 0; j < unit[1].length && num > 0; j += 1) {
            p = digit[num % 10] + unit[1][j] + p;
            num = Math.floor(num / 10);
        }
        s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
    }

    s = s.replace(/(零.)*零元/, '元').replace(/(零.)+/g, '零').replace(/^整$/, '零元整')
    if (isMinus) {
        s = `负${s}`;
    }
    return s;
}

8. 常用正则表达式

// （1）匹配 手机号
var regex = /^1[34578]d{9}$/

// （2）匹配 身份证号（18位）
var regex =  /^[1-9]d{5}(18|19|([23]d))d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)d{3}[0-9Xx]$/

// （3）匹配 qq 号
var regex = /^[1-9][0-9]{4,10}$/g;

// （4）匹配 Email
var regex =  /^([A-Za-z0-9_-.])+@([A-Za-z0-9_-.])+.([A-Za-z]{2,4})$/

// （5）用户名正则
var regex = /^[a-zA-Z$][a-zA-Z0-9_$]{4,16}$/;