1、浏览器识别
// 获取浏览器用户代理
var ua = window.navigator.userAgent.toLowerCase();
// 微信浏览器
ua.match(/MicroMessenger/i) == 'micromessenger'
// 安卓
ua.indexOf('Android') > -1 || u.indexOf('Linux') > -1
// iOS
!!ua.match(/(i[^;]+;( U;)? CPU.+Mac OS X/)
2、防抖
/**
* 防抖
* 原理:不管触发多少次事件,都会等到事件触发 n 秒后 才会执行,如果在事件触发的 n 秒内 又触发了这个事件,那么就以新的事件的时间为准重新计算
* 场景:表单提交,实时搜索
* @param funtion fn 要执行的方法
* @param int wait 间歇时间
*/
function debounce(fn, wait)
{
// 定时器初始化
let timer = null;
// 闭包
return funtion() {
if (timer) { // 如果存在定时器则清除重新计时
clearTimeout(timer);
}
timer = setTimeout(() => {
fn.apply(this, arguments);
}, wait);
}
}
3、节流
/**
* 节流
* 原理:将用户频繁操作转换为每间隔一段时间执行
* 场景:滚动加载
* @param function fn 执行函数
* @param int delay 间隔时间
*/
function throttle(fn, delay, args)
{
var prev = Date.now();
return function() {
var context = this; //this指向window
var now = Date.now();
if (now - prev >= delay) {
fn.apply(context, args);
prev = Date.now();
}
}
}