Javascript Zamanlayıcılar (setTimeout, setInterval)

Arkadaşlar bu yazımızda javascript zamanlayıcılar ın ne olduğunu ve zamanlama ile ilgili setTimeout(), setInterval(), clearTimeout() ve clearInterval() metotlerını anlatacağız.

Zamanlayıcılar belirli bir zamanda bir işlemin yapılmasını ayarlamak için kullanılır. Örneğin beş resimli bir slaytımız olsun. Bu slaytımızın resimlerinin kaç saniye aralıklarla döneceğini ayarlamak için kullanırız.

Javascript Zamanlayıcılar setTimeout() Kullanımı

setTimeout() metotu, istediğimiz kodları belirttiğimiz süre sonunda bir kez çalıştırır. Parametre olarak verdiğimiz Süre milisaniye olarak cinsinden girilir. Metota verdiğimiz süre sayfa yüklendiği anda başlar.
Örnek :

let yazdir = setTimeout(function () {
    document.write("merhaba");    
}, 3000);

Yukarıdaki örneğimizde görüldüğü gibi merhaba 3 saniye sonra geliyor…

Javascript clearTimeout() Kullanımı

clearTimeout() metotu, setTimeout() metotu ile ayarlanan zamanlayıcıyı iptal etmek için kullanırız.
Örnek :

let yazdir = setTimeout(function () {
    document.write("merhaba");    
}, 3000);
clearTimeout(yazdir);

Yukarıdaki örneğimizde görüldüğü gibi merhaba gelmeyecektir. Çünkü clearTimeout metodu ile zamanlayıcı iptal edildi.

Javascript Zamanlayıcılar setInterval() Kullanımı

setInterval() metotu, istediğimiz kodları belirttiğimiz sürede tekrar tekrar çalıştırır.
Örnek1 :

let hello = setInterval(function () {
    document.write("merhaba" + "<br/>")
},3000 )

Yukarıdaki örneğimizde görüldüğü gibi merhaba her 3 saniye bir yazdırılıyor…

Örnek2: body etiketinin arka plan rengini 1 saniye bir değiştirelim…

setInterval(deneme, 1000);
function deneme() {
    let sayi = Math.round(Math.random()*10);    
    switch (sayi) {
        case  1: 
            document.body.style.backgroundColor = "black";
            break;
        case 2: 
            document.body.style.backgroundColor = "red";        
            break;
        case 3: 
             document.body.style.backgroundColor = "blue";        
            break;
        case 4: 
             document.body.style.backgroundColor = "green"; 
            break;       
        case 5: 
             document.body.style.backgroundColor = "yellow";        
            break;
        case 6:
             document.body.style.backgroundColor = "pink";        
            break;
        case 7:
             document.body.style.backgroundColor = "purple";        
            break;
        case 8:
             document.body.style.backgroundColor = "gray";        
            break;
        case 9:
             document.body.style.backgroundColor = "darkgray";        
            break;    
        default:
             document.body.style.backgroundColor = "white";
            break;
    }    
}

Javascript clearInterval() Kullanımı

clearInterval() metotu, setInterval metotu ile ayarlanan zamanlayıcıyı iptal etmek için kullanırız.
Örnek :

let hello = setInterval(function () {
    document.write("merhaba" + "<br/>")
},3000 )
clearInterval(hello);

Yukarıdaki örneğimizde görüldüğü gibi merhaba gelmeyecektir. Çünkü clearInterval metodu ile zamanlayıcı iptal edildi.

Başka bir yazımızda görüşmek üzere…