解析:
函数节流是指一定时间内 js 方法只跑一次。比如人的眨眼睛,就是一定时间内眨一次。
这是函数节流最形象的解释。
// 函数节流 滚动条滚动
var canRun = true;
document.getElementById("throttle").onscroll = function(){
if(!canRun){
// 判断是否已空闲,如果在执行中,则直接 return
return;
}
canRun = false;
setTimeout(function(){
console.log("函数节流");
canRun = true;
}, 300);
};
函数防抖是指频繁触发的情况下,只有足够的空闲时间,才执行代码一次。比如生活中
的坐公交,就是一定时间内,如果有人陆续刷卡上车,司机就不会开车。只有别人没刷卡了,
司机才开车。
// 函数防抖
var timer = false;
document.getElementById("debounce").onscroll = function(){
clearTimeout(timer); // 清除未执行的代码,重置回初始化状态
timer = setTimeout(function(){
console.log("函数防抖");
}, 300);
};
解析:
// 这种实现方式是利用一个伪死循环阻塞主线程。因为 JS 是单线程的。所以通过这种方式
可以实现真正意义上的 sleep()。
function sleep(delay) {
var start = (new Date()).getTime();
while ((new Date()).getTime() - start < delay) {
continue;
}
}
function test() {
console.log('111');
sleep(2000);
console.log('222');
}
test()
解析:
概念: 内层函数能够访问外层函数作用域的变量
缺点: 引起内存泄漏(释放内存)
作用:
使用闭包修正打印值
实现柯里化
实现 node commonJs 模块化, 实现私有变量
保持变量与函数活性, 可延迟回收和执行