Bu eğiticide, örnekler yardımıyla JavaScript setTimeout () yöntemi hakkında bilgi edineceksiniz.
setTimeout()Yöntem, belirli bir süre sonra bir kod bloğunu yürütür. Yöntem, kodu yalnızca bir kez yürütür.
JavaScript setTimeout'un yaygın olarak kullanılan sözdizimi şöyledir:
setTimeout(function, milliseconds);
Parametreleri:
- işlev - bir kod bloğu içeren bir işlev
- milisaniye - fonksiyonun çalıştırılmasından sonra geçen süre
setTimeout()Yöntem, bir döner intervalId pozitif bir tamsayıdır.
Örnek 1: 3 Saniyeden Sonra Bir Metin Görüntüle
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) setTimeout(greet, 3000); console.log('This message is shown first');
Çıktı
Bu mesaj ilk olarak gösterilir Merhaba dünya
Yukarıdaki programda, setTimeout()yöntem 3000 milisaniye ( 3 saniye) greet()sonra işlevi çağırır .
Bu nedenle, program Hello world metnini 3 saniye sonra yalnızca bir kez görüntüler .
Not : setTimeout()Yöntem, bir süre sonra bir blok yürütmek istediğinizde kullanışlıdır. Örneğin, belirtilen süreden sonra kullanıcıya bir mesaj göstermek.
setTimeout()Yöntem aralığı id döndürür. Örneğin,
// program to display a text using setTimeout method function greet() ( console.log('Hello world'); ) let intervalId = setTimeout(greet, 3000); console.log('Id: ' + intervalId);
Çıktı
Kimlik: 3 Merhaba dünya
Örnek 2: Her 3 Saniyede Görüntüleme Süresi
// program to display time every 3 seconds function showTime() ( // return new date and time let dateTime= new Date(); // returns the current local time let time = dateTime.toLocaleTimeString(); console.log(time) // display the time after 3 seconds setTimeout(showTime, 3000); ) // calling the function showTime();
Çıktı
17:45:39 17:45:43 17:45:47 17:45:50…
Yukarıdaki program her 3 saniyede bir zamanı gösterir .
setTimeout()Yöntem, zaman aralığının (bundan sonra sadece bir kez işlevini çağırır 3 saniye).
Ancak yukarıdaki programda fonksiyon kendisini çağırdığı için program her 3 saniyede bir zamanı gösterir .
Bu program süresiz olarak çalışır (hafıza bitene kadar).
Not : Bir işlevi birden çok kez yürütmeniz gerekiyorsa, setInterval()yöntemi kullanmak daha iyidir .
JavaScript clearTimeout ()
Yukarıdaki örnekte gördüğünüz gibi, program belirtilen zaman aralığından sonra bir kod bloğu yürütür. Bu işlev çağrısını durdurmak istiyorsanız, clearTimeout()yöntemi kullanabilirsiniz .
clearTimeout()Yöntemin sözdizimi şöyledir:
clearTimeout(intervalID);
Burada yöntemin intervalIDdönüş değeri budur setTimeout().
Örnek 3: clearTimeout () Yöntemini kullanın
// program to stop the setTimeout() method let count = 0; // function creation function increaseCount()( // increasing the count by 1 count += 1; console.log(count) ) let id = setTimeout(increaseCount, 3000); // clearTimeout clearTimeout(id); console.log('setTimeout is stopped.');
Çıktı
setTimeout durduruldu.
Yukarıdaki programda setTimeout()yöntem, 3 saniye sonra sayım değerini artırmak için kullanılır. Ancak clearTimeout()yöntem , yöntemin işlev çağrısını durdurur setTimeout(). Bu nedenle sayım değeri artırılmaz.
Not : Genellikle yöntem çağrısını gerçekleşmeden önce clearTimeout()iptal etmeniz gerektiğinde kullanırsınız setTimeout().
setTimeout()Yönteme ek argümanlar da iletebilirsiniz . Sözdizimi şöyledir:
setTimeout(function, milliseconds, parameter1,… .paramenterN);
Eğer başka parametreler geçirdiğinizde setTimeout()yöntemle, bu parametreler ( parameter1, parameter2vb) belirtmek geçilecek fonksiyonu .
Örneğin,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setTimeout setTimeout(greet, 1000, 'John', 'Doe');
Çıktı
Merhaba John Doe
Yukarıdaki programda iki parametre Johnve yönteme Doegeçilir setTimeout(). Bu iki parametre greet(), setTimeout()yöntemin içinde tanımlanan işleve (burada işlev) iletilecek argümanlardır .
Önerilen Kaynaklar: JavaScript async () ve await ()
