zoukankan      html  css  js  c++  java
  • 常用的JS方法

    一,判断当前元素是否是数组

    1,通过 constructor 判断

    function isArray(value) {
        return value && typeof value == 'object' && value.constructor === Array
    }
    

    2,通过 instanceof 判断判断

    function isArray(value) {
        return value && typeof value == 'object' && value instanceof Array
    }
    

    3,通过 toString 判断

    function isArray(value) {
        return Array.isArray(value) || (typeof value == 'object' && Object.prototype.toString.call(value) === '[object Array]')
    }
    

    4,isArray 原生方法判断

    Array.isArray()

    二,判断是否是对象

    function isObject(value) {
        return value != null && typeof value === 'object' && Object.prototype.toString.call(value) === '[object Object]'
    }
    

    三,判断环境

    1,判断是否安卓

    function isAndroid() {
        return /Android/i.test(navigator.userAgent) || /Linux/i.test(navigator.appVersion);
    }
    

    2,判断是否ios

    function isIOS() {
        return (/ipad|iphone/i.test(navigator.userAgent));
    }
    

    3,判断是否是Safari

    function isSafari() {
        return (/msie|applewebkit.+safari/i.test(navigator.userAgent));
    }
    

    4,判断是否在微信

    function isWeixin() {
        return /MicroMessenger/i.test(navigator.userAgent);
    }
    

    5,判断是否为移动端

    function isMobile() {
        return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent) ||
            screen.width < 500;
    }

    四,按需加载CSS与JS

    /**
     * 按需加载js
     * @param {*} path
     */
    function delayLoadJS(path) {
        if (!path) {
            return Promise.reject();
        }
        return new Promise((resolve, reject) => {
            let dom = null;
            const scripts = document.querySelectorAll('script');
            for (let item of scripts) {
                if (new RegExp(path).test(item.src)) {
                    dom = item;
                    onload(dom, () => resolve());
                    return;
                }
            }
            if (!dom) {
                const script = document.createElement('script');
                script.src = path;
                script.onload = () => {
                    resolve();
                    script.onload = null;
                };
                script.onerror = () => reject();
                document.body.appendChild(script);
            }
        });
    }
    /**
     * 按需加载css
     * @param {*} path
     */
    function delayLoadCSS(path) {
        if (!path) {
            return Promise.reject();
        }
        return new Promise((resolve, reject) => {
            let dom = null;
            let links = document.querySelectorAll('link');
            for (let item of links) {
                if (new RegExp(path).test(item.href)) {
                    dom = item;
                    onload(dom, resolve);
                    return;
                }
            }
            if (!dom) {
                const link = document.createElement('link');
                link.rel = 'stylesheet';
                link.href = path;
                link.onload = () => {
                    resolve();
                    link.onload = null;
                };
                link.onerror = () => reject();
                document.head.appendChild(link);
            }
        });
    }
    /**
     * 解决同时异步加载同一个文件的问题
     * @param {*} dom
     * @param {*} resolve
     */
    function onload(dom, resolve) {
        const oldOnload = dom.onload;
        if (oldOnload) {
            dom.onload = () => {
                oldOnload();
                resolve();
            };
        } else {
            resolve();
        }
    }

    五,常用正则表达式

    1,邮箱

    function isEmail(email) {
        var r = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
        return r.test(email);
    }

    2,QQ

    function isQQ(qq) {
        var r = /^[1-9]d{4,10}$/;
        return r.test(qq);
    }

    3,网址

    function isUrl(str) {
        return /^(((ht)tps?)://)?[w-]+(.[w-]+)+([w-.,@?^=%&:/~+#]*[w-@?^=%&/~+#])?$/.test(str);
    }

    4,身份证

    function isCard(str) {
        return /(^d{15}$)|(^d{18}$)|(^d{17}(d|X|x)$)/.test(str);
    }

    5,汉字

    function isChinese(str) {
        return /^[u4e00-u9fa5]+$/.test(str);
    }

    6,英文

    function isEnglish(str) {
        return /^[a-zA-Z]*$/.test(str);
    }

    六,对象的深拷贝

    1,对象

    // 简单粗暴,一步到位
    JSON.parse(JSON.stringify(obj));

    2,数组

    可以用Array.slice(),Array.concat(),ES6扩展运算符...等方法来实现

    七,结语

    以上大概是目前来说项目中运用较多的一些公用方法,可能实现方法不是最好的,这里仅供参考。还有许多通用的方法,这里只想起这么多了,以后再慢慢补充吧。

  • 相关阅读:
    连接ESP32失败:等待包头 #226超时
    题王网
    高可用架构模式——CAP
    高性能负载均衡
    单服务器高性能模式
    虚拟支付
    高性能架构设计——数据库篇
    MySQL
    shell 命令: MD5
    HTTPS
  • 原文地址:https://www.cnblogs.com/zshno1/p/11270181.html
Copyright © 2011-2022 走看看