手写防抖和节流JS

最新推荐文章于 2023-06-15 18:47:49 发布

月了不光

最新推荐文章于 2023-06-15 18:47:49 发布

阅读量148

点赞数

分类专栏： JS基础文章标签： javascript 前端 html5

本文链接：https://blog.csdn.net/weixin_48315912/article/details/124848007

版权

JS基础专栏收录该内容

13 篇文章 0 订阅

订阅专栏

本文详细探讨了JavaScript中的防抖和节流技术，包括它们的概念、应用场景及实现原理，帮助开发者优化前端性能，减少不必要的计算和渲染。

摘要由CSDN通过智能技术生成

防抖和节流

防抖

let input=document.querySelector("input");
let timer=null;
input.oninput=function(){						//oninput 事件在用户输入时触发
    clearTimeout(timer);
    timer=setTimeout(()=>{
        console.log(this.value);
    },1000)
}

节流

let count=0;
(function(){
   let flag=true;
btn.onclick=function(){
    if(!flag)	return;
        flag=false;
    setTimeout(()=>{
        flag=true;
    },1000);
    
    console.log(++count);
} 
})()