![[吐舌]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_95.6b0752f.png)
![[勾引]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_121.570cd4d.png)
![[不失礼貌的微笑]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_16.9d17f6d.png)
呦丶彭于晏
逮虾能手
获得徽章 6
赞了这篇沸点
#每天一个知识点#
js 实现防抖和节流函数
1. 防抖函数（Debounce）
function debounce(func, delay) {
let timer;
return function(...args) {
const context = this;
clearTimeout(timer);
timer = setTimeout(() => {
func.apply(context, args);
}, delay);
};
}
// 使用示例
window.addEventListener('resize', debounce(() => {
console.log('Window resized');
}, 500));
2. 节流函数（Throttle）
function throttle(func, interval) {
let lastTime = 0;
return function(...args) {
const now = Date.now();
if (now - lastTime >= interval) {
func.apply(this, args);
lastTime = now;
}
};
}
// 使用示例
window.addEventListener('scroll', throttle(() => {
console.log('Window scrolled');
}, 500));
js 实现防抖和节流函数
1. 防抖函数（Debounce）
function debounce(func, delay) {
let timer;
return function(...args) {
const context = this;
clearTimeout(timer);
timer = setTimeout(() => {
func.apply(context, args);
}, delay);
};
}
// 使用示例
window.addEventListener('resize', debounce(() => {
console.log('Window resized');
}, 500));
2. 节流函数（Throttle）
function throttle(func, interval) {
let lastTime = 0;
return function(...args) {
const now = Date.now();
if (now - lastTime >= interval) {
func.apply(this, args);
lastTime = now;
}
};
}
// 使用示例
window.addEventListener('scroll', throttle(() => {
console.log('Window scrolled');
}, 500));
展开
评论
4
![[灵光一现]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_25.51e6984.png)
。
赞了这篇沸点
![[惊喜]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_93.5ee641b.png)
![[流泪]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_6.dde0d83.png)