简介
在 JavaScript 中，防抖（debounce）和节流（throttle）是用来限度函数执行频率的两种常见技术。
防抖（debounce） 是指在某个时间段内，只执行最初一次触发的函数调用。如果在这个时间段内再次触发该函数，会从新计时，直到等待时间完结才会执行函数。
这个技术通常用于解决频繁触发的事件，比方窗口大小调整、搜寻框输出等。防抖能够防止函数执行过屡次，以缩小网络开销和性能累赘。
节流（throttle） 是指在一段时间内限度函数的执行频率，保障肯定工夫内只执行一次函数调用。无论触发频率多高，都会在指定工夫距离内执行一次函数。
这个技术通常用于解决间断触发的事件，比方滚动事件、鼠标挪动事件等。节流能够管制函数的执行频率，以缩小资源耗费和进步性能。
防抖
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button id="btn">防抖</button></body>// 引入lodash文件<script src="/node_modules/lodash/lodash.js"></script><script> btn.onclick = _.debounce(function() { console.log('防抖在某段时间内只执行最初一次'); },1000)</script></html>节流
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button id="btn">节流</button></body>// 引入lodash文件<script src="/node_modules/lodash/lodash.js"></script><script> btn.onclick = _.throttle(function() { console.log('节流是指在一段时间内限触发的次数'); },1000)</script></html>
lodash网址:https://www.lodashjs.com/