欢迎访问 生活随笔！
TAG聚合

生活随笔

当前位置： 首页 > 编程资源 > 编程问答 >内容正文

编程问答

防抖动函数(debounce)的原理

发布时间：2024/10/12 编程问答 41 豆豆
生活随笔 收集整理的这篇文章主要介绍了 防抖动函数(debounce)的原理 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

debounce就是防抖动， 在间隔不超过500ms的情况下，不管debounce执行多少次， lazyLoad都只执行一次；

function debounce() {clearTimeout(timer);timer = setTimeout(function() {lazyLoad();}, 500);} }

clearTimeout使得lazyLoad不会立即执行，每次debounce调用都会重置定时器，并再次等待，只有等debounce不再调用，并等待500ms之后lazyLoad才会被调用。

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body style="height:2000px"> <script>/*debounce就是防抖动， 在间隔不超过500ms的情况下，不管debounce执行多少次，srollFn都只执行一次；clearTimeout使得srollFn不会立即执行，每次debounce调用都会重置定时器，并再次等待，只有等debounce不再调用，并等待500ms之后srollFn 才会被调用。*/var num=0;function lazyLoad() {num++;console.log(num);}var timer = null;function debounce() {clearTimeout(timer);timer = setTimeout(function() {lazyLoad();}, 1000);}window.onscroll= debounce;</script> </body> </html>

 

转载于:https://www.cnblogs.com/aredleave/p/7573161.html

总结

以上是生活随笔为你收集整理的防抖动函数(debounce)的原理的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。