زمان بندی (Timing)
در زمان بندی جاوااسکریپت، کد در فاصله های زمانی اجرا می شود. رویداد (Event) یعنی اتفاقی که اجرا را شروع می کند. اینجا با دو متد اصلی آشنا می شویم: setTimeout و setInterval.
رویدادهای زمان بندی
شیء «window» اجرای کد را در بازه های مشخص ممکن می کند. setTimeout یک بار اجرا می کند. setInterval تکراری اجرا می کند.
setTimeout (اجرا پس از تاخیر)
setTimeout یک تابع را پس از چند میلی ثانیه اجرا می کند. میلی ثانیه یعنی هزارم ثانیه.
function myFunction() {
alert("Hello");
}
setTimeout(myFunction, 3000);
نکته: می توانی پیشوند window. را حذف کنی. هر دو معتبر هستند.
توقف setTimeout با clearTimeout
برای لغو اجرای برنامه ریزی شده از clearTimeout استفاده کن. باید شناسه تایمر را نگه داری.
let myVar;
myVar = setTimeout(myFunction, 3000);
clearTimeout(myVar);
setInterval (اجرا تکرارشونده)
setInterval تابع را هر فاصله زمانی تکرار می کند. مثل ساعت دیجیتال.
function myTimer() {
const d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
setInterval(myTimer, 1000);
نکته: هر 1000 میلی ثانیه برابر یک ثانیه است.
توقف setInterval با clearInterval
برای توقف اجرای تکراری از clearInterval استفاده کن. شناسه تایمر لازم است.
let myVar;
myVar = setInterval(myTimer, 1000);
function myTimer() {
const d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
// وقتی لازم شد:
clearInterval(myVar);
تمرین گام به گام
- یک تابع ساده بساز.
- با setTimeout آن را دیرتر اجرا کن.
- شناسه را نگه دار و لغوش کن.
- با setInterval اجرا را تکرار کن.
- با clearInterval آن را متوقف کن.
برای ادامه موضوعات مرتبط، صفحه پنجره های هشدار و صفحه کوکی ها را ببین.
جمع بندی سریع
- setTimeout یک بار اجرا می کند.
- clearTimeout اجرا را لغو می کند.
- setInterval تکراری اجرا می کند.
- clearInterval تکرار را متوقف می کند.
- 1000 میلی ثانیه یعنی یک ثانیه.