توابع زمان‌بندی setTimeout و setInterval

مقدمه

دو تابع مهم setTimeout و setInterval برای زمان‌بندی اجرای کد در آینده یا به صورت تکراری در جاوااسکریپت استفاده می‌شوند. این توابع پایه توسعه رابط کاربری، انیمیشن، آلارم و کنترل تایمرها هستند. کنترل زمان اجرا به شما اجازه می‌دهد تجربه کاربری بهتری بسازید، عملیات غیرهمزمان انجام دهید یا اجرای کدها را در فواصل مشخص کنترل کنید.

setTimeout: اجرای تاخیری یک تابع

تابع setTimeout برای اجرای یک تابع پس از مدت مشخص (برحسب میلی‌ثانیه) استفاده می‌شود. ساختار آن ساده است: setTimeout(fn, delay) که fn تابعی است که باید اجرا شود و delay مدت زمان تاخیر بر حسب میلی‌ثانیه است. مثال زیر را ببینید.

JAVASCRIPT

setTimeout(function() {
  console.log("2 seconds elapsed");
}, 2000);

این کد یک تابع را پس از ۲۰۰۰ میلی‌ثانیه (۲ ثانیه) اجرا می‌کند و پیام مورد نظر را در کنسول چاپ می‌نماید.

setInterval: اجرای تکراری یک تابع

setInterval یک تابع را با فاصله زمانی مشخص (برحسب میلی‌ثانیه) بارها و بارها اجرا می‌کند تا زمانی که صریحاً متوقف شود. مثال زیر را ببینید.

JAVASCRIPT

let count = 0;
let timer = setInterval(function() {
  count++;
  console.log(`second ${count}`);
  if (count === 5) clearInterval(timer);
}, 1000);

این کد هر ثانیه مقدار count را افزایش می‌دهد و پیام مربوط به ثانیه فعلی را چاپ می‌کند؛ پس از رسیدن به عدد ۵، با clearInterval اجرای تایمر متوقف می‌شود.

ارسال آرگومان و شناسه تایمر

می‌توانید به setTimeout و setInterval آرگومان اضافی نیز بدهید که به تابع callback ارسال شود. همچنین شناسه تایمر برای مدیریت و لغو آن قابل استفاده است. مثال زیر را ببینید.

JAVASCRIPT

setTimeout(function(msg) {
  console.log(msg);
}, 1500, "deferred message");

پیام "deferred message" پس از ۱.۵ ثانیه به تابع callback ارسال و چاپ می‌شود.

setTimeout و setInterval ابزارهای اصلی مدیریت زمان‌بندی در جاوااسکریپت هستند و تقریباً در همه پروژه‌ها کاربرد دارند؛ چه در انیمیشن، چه در تاخیر درخواست‌ها و چه برای ساخت تایمرها.

همیشه تایمرهای setInterval را در زمان مناسب با clearInterval متوقف کنید تا از مصرف بیهوده منابع و بروز باگ جلوگیری شود.