JavaScript Timer Sınıfı – Zamanlayıcı Kullanımı

SerkanKacan

Paylaşım Ekibi
28 May 2019
362
13
istanbul
Credits
0
JavaScript Timer Sınıfı – Zamanlayıcı Kullanımı
JavaScript fonksiyonlarının belirlenen bir süre sonunda ya da belli aralıklarla tekrar ederek çalışmasını sağlayabiliriz.
setTimeout metodu istediğimiz fonksiyonun
Bu linki görmek için izniniz yok Giriş yap veya üye ol.
belirtilen süre kadar sonra çalıştırılması, setInterval metodu ise istediğimiz fonksiyonun belirlenen aralıklarla sürekli olarak tekrar etmesini sağlar.
setTimeout Metodu
Kod:
window.setTimeout( çalıştırılacakFonksiyonAdı, milisaniye)
Milisaniye cinsinden belirtilen süre kadar bekleyip, bu süre dolduğunda belirtilen fonksiyonu çalıştırır. Bu sayfada anlatılan tüm metotlar window sınıfına ait olup, metot isimlerinden önce Window sınıfı yazılmasa da olur.

JavaScript:
<script>

setTimeout(aaa,3000);

function aaa() {

document.getElementById("sonuc").innerHTML="Süre doldu.";

}

</script>
Alttaki örnekte ise butona tıklandığında setTimeout metodu çalıştırılmış ve 2 saniye sonra yazdır fonksiyonunun çalışması sağlanmıştır.

JavaScript:
<script>



function yazdir() {



document.getElementById("sonuc").innerHTML="Süre doldu.";



}



</script>

<button onclick="setTimeout(yazdir, 2000)">Süreyi Başlat</button>
setTimeout metodu çalıştırılıp geri sayım başladıktan sonra bu metodun çalışmasını engellemek istersek clearTimeout metodunu kullanabiliriz.


Kod:
window.clearTimeout(degiskenAdi);
clearTimeout metodu içerisinde durdurulmak istenen setTimeout metodunun geri döndürdüğü değeri belirtmek gerekir
Bu linki görmek için izniniz yok Giriş yap veya üye ol.
Bunun için de setTimeout metodu çalıştırılırken bir değişkene eşitlenir. Bu değişken clearTimeout metodu içinde kullanılarak ilgili setTimeout metodu durdurulur.


Kod:
Var degisken1 = setTimeout(aaa, milliseconds);

Yukarıdaki gibi kullanılan bir setTimeout metodu, aşağıdaki şekilde çalışmadan durdurulabilir.


Kod:
clearTimeout(degisken1);
Örnek: Sayfamızda iki tane buton bulunsun. Bunlardan ilki setTimeout metodunu çalıştırarak 3 sn sonra yazdır fonksiyonunun işletilmesini sağlasın. İkinci buton ise clearTimeout metodu ile zamanlanan işlemi durdursun. Yani ilk butona basıldıktan sonra 3 sn içinde ikinci butona basarak işlem iptal edilebilecektir.

Birinci butonu şu şekilde oluşturalım:
JavaScript:
<button onclick="degisken1 = setTimeout(yazdir, 3000)">Süreyi Başlat</button>
İkinci buton da şu şekilde olmalı:


JavaScript:
<button onclick="clearTimeout(degisken1)">Durdur</button>
setInterval() Methodu
Kullanımı setTimeout metodu gibidir
Bu linki görmek için izniniz yok Giriş yap veya üye ol.
Yaptığı iş ise belirtilen fonksiyonu belirtilen süre kadar aralık ile sürekli çalıştırır.

Kod:
window.setInterval(fonksiyonAdi, milisaniye);

Aşağıdaki örnekte bbb isimli fonksiyon saniyede 2 kez çağrılacak ve kutu1’in içine nokta karakteri ekleyecektir.


JavaScript:
setInterval(bbb, 500);

function bbb() {

document.getElementById("kutu1").innerHTML+=".";

}
kaynak : btdersleri.com