跳到主要内容

throttle()

function throttle<Func>(func, timeFrame): (this, ...args) => void;

Defined in: function/throttle.ts:32

创建一个节流函数,确保函数在指定时间间隔内最多执行一次 与防抖不同,节流会定期执行函数,而非等待最后一次调用后执行,适用于限制高频事件(如滚动、调整大小)的触发频率

Type Parameters

Type ParameterDescription
Func extends AnyFunction被节流的函数类型

Parameters

ParameterTypeDescription
funcFunc需要节流的函数
timeFramenumber时间间隔(毫秒),在此期间函数最多执行一次

Returns

节流后的函数

(this, ...args): void;

Parameters

ParameterType
thisThisParameterType<Func>
...argsParameters<Func>

Returns

void

Examples

// 基础用法
const handleScroll = throttle(() => {
console.log('滚动位置:', window.scrollY);
}, 100);
window.addEventListener('scroll', handleScroll);
// 带参数和this上下文
const logger = {
prefix: 'Log:',
log: throttle(function(message: string) {
console.log(this.prefix, message);
}, 200)
};
logger.log('Hello');
logger.log('World'); // 200ms内只会执行一次
**Note:** 节流函数会忽略在时间间隔内的调用,不累积执行
**Note:** 首次调用会立即执行,之后按时间间隔限制
**Warning:** 确保timeFrame为正整数,否则可能导致意外行为