Javascript zaman fonksiyonları

Sezai AlkanFrontend Developer

JavaScript #settimeout #cleartimeout #setinterval #clearinterval #zaman

Javascript Zaman Fonksiyonları, Javascript te Yardımcı Fonskiyonlar İle Belirli Bir Süre Sonra İşlem Yaptırabiliriz. Temelde Dört Fonskiyon Vardır. Bunları Teker Teker Ele Alalım.

1. setTimeout()

setTimeout İle Yaptıraceğımız İşlem, Belirlediğimiz Sürede Sadece 1 Kere Çalışır Kendini Asla Tekrar Etmez.

<script type="text/javascript">
   function yaz(){
       alert("Ekran Çıktısı");
   }
   setTimeout("yaz()", "1000");
</script>

Fonsiyonları İki Türlü Kullanabiliriz. Bir Fonksiyonu Dışarıda Oluşturup. setTimeout İçersinde Çağırabiliriz. Birde Direk setTimeout İçersinde İşlem Yaptırabiliriz.

<script type="text/javascript">
   setTimeout(function(){
       alert("Ekran Çıktısı");
   }, "3000");
</script>

Yukarıdaki Örnekle İlk Yaptığımız Örnek Aynıdır. Yaptıracağımız İşlemi Fonksiyon İçerisindede Yaptırabiliyoruz.

2. clearTimeout()

clearTimeout Fonksiyonu setTimeout İle Oluşturulan İşlemi İptal Eder. Örnek Vermek Gerekirse setTimeout İle Kullanıcı İşlemi 10 Dakika İçersinde Yapmazsa Sistemden At Gibi Bir Fonksiyon Oluşturduk. Fakat Kullanıcı 10 Dakika İçersinde İşlem Yaparsa clearTimeout İle İşlemi Sil Diyebilir.

<script type="text/javascript">
    var islem = setTimeout(function(){
        alert("Sistem Kapandı");
    },"10000");
    function durdur(){
        window.clearTimeout(islem);
        alert("Sistem Kapanmayacak");
    }
</script>
<input type="button" value="Sistemi Kapatma ||" onclick="durdur();">

Yukarıdaki Örnekte 10 Sn İçinde Kullanıcı Butona Tıklamazsa Alert İle Sistem Kapandı Diye Uyarı Verecek Eğer Kullanıcı 10 sn İçince Butona Tıklarsa Kapanma İşlemini Durdurup Alert İle Kullanıcıya Sistem Kapanmayacak Uyarısını Verecektir.

3. setInterval()

setInterval Fonksiyonu İle Bir İşlemi Belirlenen Süre İçinde Tekrar Etmesini Sağlar. Sonsuz Döngüde Oluşturulabilir. Durdurulmadığı Sürede Kendini Hep Tekrar Eder.

<script type="text/javascript">
    sayi = 60;
    setInterval(function(){
        console.log(sayi);
        sayi--;
    },1000);
</script>

Yukarıdaki Örnekte sayi Değişkenine 60 Rakamını Atatık. Ve setInterval Fonksiyonu İçersinde 1000 mili Saniyede (1sn) Sayiyi 1 Eksiltmesini İstedik. Tabi Fonksiyonu 0 Gelince Durdurmazsanız -(Eksi) Sayılar İle Saydırmaya Devam Edecektir.

4. clearInterval()

clearInterval Fonksiyonu İle setInterval Fonksiyonunu Durdurur, Yok Eder. Yukarıda setInterval İle Oluşturulmuş Örnekte Durdurulmadığı Sürede -(Eksi) Sayılar İle Saydırmaya Devam Edecekti Bu Örnektede Sayı Değişkeni 0 a Eşit Denk Olduğunda clearInterval Fonksiyonu İle setInterval Fonksiyonunu Durduralım.

<script type="text/javascript">
    sayi = 60;
    function dur(gelenSayi){
        if(gelenSayi == 0){
            clearInterval(sonuc);
        }
    }
    sonuc = setInterval(function say(){
        console.log(sayi);
        dur(sayi);
        sayi--;
    },1000);
</script>

Yukarıdaki Örnekte dur Adında Bir Fonksiyon Oluşturduk Dışarıdanda Bir Parametre Almasını Sağladık Bu Fonksiyonu setInterval İçersinde Oluşturduğumuz Fonksiyon İle Çağırdık Ve Parametre Olarak sayi Değişkenini Verdik. dur Fonksiyonu İçersinde gelenSayi 0 a Eşit Olduğunda clearInterval İle sonuc Değişkenini Silecektir.