زمانبندی رویدادها

زمانبندی رویدادها

در JavaScript، می توان یک تابع را در فاصله های زمانی معین اجرا کرد.

این قابلیت زمانبدی رویدادها (Timing Events) نامیده می شود.

زمانبدی رویدادها (Timing Events) در JavaScript:

در JavaScript، این امکان وجود دارد که یک قطعه کد را در فاصله های زمانی معیین (time-intervals) اجرا کنید. به این امکان “زمانبندی رویدادها” یا (Timing Events) می گویند.

دو متد (method) ساده برای زمانبدی رویدادها وجود دارد:

  • ()setInterval : در فاصله های زمانی معیین، یک تابع را بارها و بارها اجرا می کند.
  • ()setTimeout : بعد از گذشت یک فاصله زمانی معیین، یک تابع را یکبار اجرا می کند.

توجه: متدهای ()setInterval و ()setTimeout هر دو جزء متدهای شیء window در مدل DOM هستند.


متد ()setInterval

متد ()setInterval، در فاصله های زمانی معین، یک تابع مشخص را بارها و بارها اجرا می کند.

نحوه استفاده:

window.setInterval(” javascript function “, milliseconds );

متد ()window.setInterval را می توان بدون پیشوند window نیز نوشت.

پارامتر اول متد ()setInterval باید یک تابع باشد.

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

توجه: هر ۱۰۰۰ میلی ثانیه معادل ۱ ثانیه است.

مثال

هر ۳ ثانیه یکبار، پیغام “Hello” نمایش داده می شود:

setInterval(function(){alert(“Hello”)},3000);

این مثال، فقط طرز کار متد ()setInterval را نشان می دهد و اینکه بخواهید هر ۳ ثانیه یکبار یک پیغام را نمایش دهید خیلی واقعی نیست.

در مثال زیر، متد ()setInterval برای نمایش یک ساعت دیجیتال، تابع ()myTimer را هر ۱ ثانیه یکبار اجرا می کند:

مثال

نمایش زمان جاری:

var myVar=setInterval(function(){myTimer()},1000);

function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById(“demo”).innerHTML=t;
}


چگونه اجرا را متوقف کنیم؟

متد ()clearInterval، برای توقف اجرای تابع مشخص شده در ()setInterval استفاده می شود.

نحوه استفاده:

window.clearInterval( intervalVariable )

متد ()window.clearInterval را می توان بدون پیشوند window نیز نوشت.

برای اینکه بتوان از متد ()clearInterval استفاده کرد، باید زمان ایجاد متد ()setInterval، از یک متغیر عمومی استفاده کرد:

myVar=setInterval(” javascript function “, milliseconds );

سپس قادر خواهید بود برای توقف اجرای تابع، از متد ()clearInterval استفاده کنید.

مثال

مثال زیر مانند قبل است، اما یک دکمه “Stop time” به آن اضافه شده است:

<p id=”demo”></p>
<button onclick=”myStopFunction()”>Stop time</button>

<script>
var myVar=setInterval(function(){myTimer()},1000);
function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById(“demo”).innerHTML=t;
}
function myStopFunction()
{
clearInterval(myVar);
}
</script>


متد ()setTimeout

متد ()setTimeout، بعد از گذشت یک فاصله زمانی معیین، یک تابع را یکبار اجرا می کند

نحوه استفاده:

window.setTimeout(” javascript function “, milliseconds );

متد ()window.setTimeout را می توان بدون پیشوند window نیز نوشت.

پارامتر اول متد ()setTimeout باید یک تابع باشد.

پارامتر دوم، نشان می دهد که از حالا چند میلی ثانیه دیگر می خواهید پارامتر اول، اجرا شود. (برحسب میلی ثانیه)

مثال

بعد از گذشت ۳ ثانیه پیغام “Hello” ظاهر می شود:

setTimeout(function(){alert(“Hello”)},3000);

چگونه اجرا را متوقف کنیم؟

متد ()clearTimeout، برای توقف اجرای تابع مشخص شده در ()setTimeout استفاده می شود.

نحوه استفاده:

window.clearTimeout( timeoutVariable )

متد ()window.clearTimeout را می توان بدون پیشوند window نیز نوشت.

برای اینکه بتوان از متد ()clearTimeout استفاده کرد، باید زمان ایجاد متد ()setTimeout، از یک متغیر عمومی استفاده کرد:

myVar=setTimeout(” javascript function “, milliseconds );

سپس، اگر تابع قبلاً اجرا نشده باشد، قادر خواهید بود برای توقف اجرای تابع، از متد ()setTimeout استفاده کنید.

مثال

مثال زیر مانند قبل است، اما یک دکمه “Stop time” به آن اضافه شده است:

var myVar;

function myFunction()
{
myVar=setTimeout(function(){alert(“Hello”)},3000);
}

function myStopFunction()
{
clearTimeout(myVar);
}



اگه خوشت اومد به اشتراک بزار


اگه به اشتراک نزاشتی حداقل لایک کن:(

نظر شما در رابطه با این آموزش چیست


بالا

تمامی حقوق مادی و معنوی این وبسایت محفوظ میباشد و متعلق است به Webtekar.ir.
Google