歪谈js
起因:
夜深人静,月朗星稀。'window.onresize 事件' 与 '浏览器'在大战300回合,console.log('1') 1s 十次,然后就结束了,一个悲伤的故事。
事实证明太快不好,需要一些技巧拯救一下--- 函数节流
经过:
1s10次频率太多了,降低频率,上一次还没爽够,又开始下一次,浪费资源。需要强制控制一下频率。throttle---节流阀的意思。
var throttle = function (fn, interval) {
var __self = fn, // 保存需要被延迟执行的函数引用
timer, // 定时器
firstTime = true; // 是否是第一次调用 第一次进入
return function () {
var args = arguments,
__me = this;
if (firstTime) { // 如果是第一次调用,不需延迟执行 立即插入
__self.apply(__me, args); //执行 函数
return firstTime = false;
}
if (timer) { // 如果定时器还在,说明前一次延迟执行还没有完成
return false;
}
timer = setTimeout(function () { // 延迟一段时间执行 强制控制
clearTimeout(timer); // 清除
timer = null;
__self.apply(__me, args);
}, interval || 500);
};
};
window.onresize = throttle(function () {
console.log(1);
}, 500);
// 代码 直接 扒自 js设计模式
结束:
'window.onresize 事件' 与 '浏览器' 又没羞没躁的 开始了。。。