共计 2881 个字符,预计需要花费 8 分钟才能阅读完成。
一,判断当前元素是否是数组
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 扩展运算符... 等方法来实现
七,结语
以上大概是目前来说项目中运用较多的一些公用方法,可能实现方法不是最好的,这里仅供参考。还有许多通用的方法,这里只想起这么多了,以后再慢慢补充吧。
作者:易企秀——易小星