请用typescript写一个防抖函数,要代码高亮,且加上每一行的注释。
时间: 2023-09-17 08:06:17 浏览: 160
### 回答1:
// 防抖函数,用于在指定的时间间隔内阻止函数的执行
// 首先定义一个变量记录上次触发事件的时间
let lastTime: number;
// 定义函数fn,可以接受一个参数delay,表示延迟时间
function debounce(delay: number) {
// 返回一个函数,用于接收传入的参数fn,用于执行
return function(fn: Function) {
// 获取当前时间
let nowTime = +new Date();
// 如果距离上次执行的时间超过了delay,则执行
if (nowTime - lastTime > delay) {
fn();
// 更新上次执行的时间
lastTime = nowTime;
}
};
}// 使用示例
let debounceFn = debounce(1000);
debounceFn(() => {
// 这里写需要被防抖的代码
});
### 回答2:
防抖函数是指在一段时间内,如果有连续的函数调用,只执行最后一次调用。以下是使用TypeScript编写的一个带有注释的防抖函数代码:
```typescript
/**
* 防抖函数:在一段时间内,如果有连续的函数调用,只执行最后一次调用
* @param {Function} func - 需要执行的函数
* @param {number} wait - 延迟时间,单位为毫秒
* @returns {Function} - 包装后的函数
*/
function debounce(func: Function, wait: number): Function {
let timeout: any;
return function executedFunction(...args: any[]) {
// 清除当前等待的延迟任务
clearTimeout(timeout);
// 创建一个新的延迟任务
timeout = setTimeout(() => {
func.apply(this, args);
}, wait);
};
}
```
上述代码中的防抖函数接受两个参数:`func`表示需要执行的函数,`wait`表示延迟时间。在返回的函数中,通过`setTimeout`设置一个延迟任务,当外部连续调用时,会清除之前的延迟任务,再重新创建新的延迟任务来延迟执行函数。借助闭包,保留了`timeout`变量的引用,以便在下一次调用时清除之前的延迟任务。
这个防抖函数可以用于处理一些频繁触发的事件,例如窗口大小变化、滚动事件等需要控制触发频率的场景。
阅读全文