防抖(前端)
前言:
在前端开发中有一部分的用户行为会频繁的出发事件执行,而对于DOM操作、资源加载等耗费性能的处理,很可能导致界面卡顿,甚至浏览器的崩溃。函数防抖(debounce)就是为了解决类似需求应用而生的。(写给新手,最终代码在最下方,请一步一步看)
解释:
函数防抖就是在函数需要频繁出发情况时,只有足够空闲的时间,才执行一次,好像公交司机等人都上车后才出站一样。
弄清楚什么是防抖?
- 比如说我们现在要实现一个需求:利用input框实现一个实时搜索,我们怎么做?废话不多说,我们一步一步来。
![在这里插入图片描述](https://img-blog.csdnimg.cn/25074d0359a44588831855cc5eeccb7a.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6ZSk5a2QbA==,size_20,color_FFFFFF,t_70,g_se,x_16)
![在这里插入图片描述](https://img-blog.csdnimg.cn/7935bde5807447ce87fdc0b5ec807541.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6ZSk5a2QbA==,size_20,color_FFFFFF,t_70,g_se,x_16)