1.38.0throttle
تابعی ایجاد میکند که اجرای تابع دادهشده را به حداکثر یک بار در هر بازه زمانی مشخصشده محدود میکند.
throttle(fn, delay):(...args: TArgs) => voidپارامترها
fn(...args: TArgs) => voidالزامیتابعی که در هر بازه زمانی مشخصشده حداکثر یک بار اجرا میشود.
delaynumberالزامیحداقل زمان بر حسب میلیثانیه که باید بین دو اجرای تابع سپری شود.
مقدار بازگشتی
(...args: TArgs) => voidتابعی را برمیگرداند که تعداد دفعات اجرای تابع اصلی را در طول زمان کنترل میکند.
مثالها
استفاده پایه
فراخوانیهای تکراری در طول بازه delay نادیده گرفته میشوند.
const log = throttle(() => {
console.log("Executed");
}, 1000);
log();
// Executed
log();
// Ignored
log();
// Ignoredاجرا پس از پایان delay
پس از گذشت delay از آخرین اجرا، فراخوانی بعدی میتواند اجرا شود.
const log = throttle(() => {
console.log("Executed");
}, 1000);
log();
// Executed
// After 1000ms or more:
log();
// Executedارسال آرگومان
آرگومانهای فراخوانی مجاز مستقیماً به تابع اصلی ارسال میشوند.
const logValue = throttle((value: string) => {
console.log(value);
}, 1000);
logValue("first");
// first
logValue("second");
// Ignored if called before the delay expiresمناسب برای رویدادهای پرتکرار
میتوان از throttle برای محدود کردن تعداد دفعات پاسخ تابع به رویدادهای پرتکرار استفاده کرد.
const handleScroll = throttle(() => {
console.log("Scroll handled");
}, 200);
window.addEventListener("scroll", handleScroll);آرگومانهای متفاوت بین اجراها
فقط آرگومانهای فراخوانیهایی که واقعاً اجرا میشوند به تابع اصلی ارسال میشوند.
const logValue = throttle((value: number) => {
console.log(value);
}, 1000);
logValue(1);
// 1
logValue(2);
// Ignored if called before the delay expires
// After the delay:
logValue(3);
// 3بدون اجرای تأخیری
فراخوانیهایی که در طول delay نادیده گرفته میشوند در صف قرار نمیگیرند و بعداً اجرا نمیشوند.
const log = throttle(() => {
console.log("Executed");
}, 1000);
log();
// Executed
log();
// Ignored
// Waiting does not execute the ignored call automatically.