目录JAVA全系列 教程
3762个小节阅读：7091.4k
目录
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本，未来主流的版本
人工智能 教程
顺势而为，AI创新未来
大厂算法 教程
算法，程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
节流严格算起来应该属于性能优化的知识，但实际上遇到的频率相当高，处理不当或者放任不管就容易引起浏览器卡死
继续思考，使用上面的防抖方案来处理问题的结果是
如果在限定时间段内，不断触发滚动事件（比如某个用户闲着无聊，按住滚动不断的拖来拖去），只要不停止触发，理论上就永远不会输出当前距离顶部的距离
但是如果产品同学的期望处理方案是：即使用户不断拖动滚动条，也能在某个时间间隔之后给出反馈呢？
其实很简单：我们可以设计一种类似控制阀门一样定期开放的函数，也就是让函数执行一次后，在某个时间段内暂时失效，过了这段时间后再重新激活（类似于技能冷却时间）
效果：如果短时间内大量触发同一事件，那么在函数执行一次之后，该函数在指定的时间期限内不再工作，直至过了这段时间才重新生效
实现
这里借助setTimeout来做一个简单的实现，加上一个状态位valid来表示当前函数是否处于工作状态
xxxxxxxxxxfunction throttle(fn,delay){ let valid = true return function() { if(!valid){ //休息时间 暂不接客 return false } // 工作时间，执行函数并且在间隔期内把状态位设为无效 valid = false setTimeout(function(){ fn() valid = true; }, delay) }}
function showTop () { var scrollTop = document.documentElement.scrollTop; console.log('滚动条位置：' + scrollTop);}window.onscroll = throttle(showTop,300) 如果一直拖着滚动条进行滚动，那么会以300ms的时间间隔，持续输出当前位置和顶部的距离
讲完了这两个技巧，下面介绍一下平时开发中常遇到的场景:
实时效果反馈
1. 以下是关于定时器节流代码，横线处填写代码是：
xxxxxxxxxxfunction throttle(fn,delay){ let valid = true return function() { if(_1_){ return false } valid = false _2_(function(){ fn() valid = true; }, delay) }}A valid setTimeout
B valid setInterval
C !valid setTimeout
D !valid setInterval
答案
1=>C