本文深入探讨了JavaScript中的防抖和节流技术，这两种技术常用于优化频繁触发的事件处理，如搜索查询和滚动事件。防抖确保在用户停止输入一段时间后才执行操作，而节流则限制事件处理的频率。通过计时器和闭包，我们可以实现高效、无副作用的防抖和节流函数。示例代码展示了如何在实际场景中应用这些技术，提高性能并减少不必要的资源消耗。
防抖与节流
防抖
防抖概念： 用户触发事件过于频繁，只需要处理最后一次事件的操作。
防抖案例： 比如在搜索框搜索查询时，只在用户输入完之后才去服务器查询搜索关键字信息。就运用了防抖。如果不运用防抖，那么用户的每一个输入都会与服务器进行一次交互，严重影响性能，且浪费资源。
<body> <!-- html -->
<input type="text">
<script> /* javascript */
let inp = document.querySelector("input");
inp.oninput = function(){
console.log(this.value);
}
</script>
</body>
利用计时器实现防抖： 我们可以通过 setTimeout 的方式，在一定的时间间隔内，只处理多次事件触发中的最后一次事件。
let inp = document.querySelector("input")
最低0.47元/天 解锁文章
扫一扫
999
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
