JavaScript vaqt hodisalari (Timing Events)

Vaqt hodisalari kodni quyidagicha bajarishga imkon beradi:

• Ma'lum bir kechikishdan keyin
• Yoki takroriy ravishda

Vaqtni boshqarish tizim soati tomonidan yaratilgan vaqt hodisalari orqali amalga oshiriladi.

---

Taymer funksiyalari

Funksiya	Tavsif
setTimeout()	Soat taymerini o'rnatadi (bir marta ishlaydi)
setInterval()	Soat intervalini o'rnatadi (takroriy ishlaydi)
clearTimeout()	Taymerni tozalaydi (to'xtatadi)
clearInterval()	Intervalni tozalaydi (to'xtatadi)

Eslatma

Taymer funksiyalari window obyektiga tegishli. setTimeout() aslida window.setTimeout() bilan bir xil.

---

Soat misoli

Ushbu misol har soniyada vaqtni yangilab turadi:

<p id="clock"></p>

<script>
  // Har 1000 millisekundda showTime ni chaqirish
  setInterval(showTime, 1000)

  // Vaqtni ko'rsatish funksiyasi
  function showTime() {
    const d = new Date()
    document.getElementById('clock').innerHTML =
      d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds()
  }
</script>

---

setTimeout() metodi

setTimeout() metodi ma'lum bir millisekundlik kechikishdan keyin funksiyani bajaradi.

setTimeout(function, delay, p1, ..., pN)

Parametrlar

Parametr	Tavsif
function	Majburiy. Taymer muddati tugaganda chaqiriladigan funksiya.
delay	Ixtiyoriy. Taymer kutishi kerak bo'lgan millisekundlar. Standart 0 (darhol).
p1, ..., pN	Ixtiyoriy. Funksiyaga uzatiladigan argumentlar.

Qaytariladigan qiymat

Integer - Taymerni noyob tarzda identifikatsiya qiluvchi butun son. Ushbu "timeout ID" keyinchalik taymerni bekor qilish uchun clearTimeout() ga uzatilishi mumkin.

<button id="btn">Boshlash</button>
<p id="demo"></p>

<script>
  document.getElementById('btn').addEventListener('click', function () {
    // 2 soniyadan keyin showMsg ni chaqirish
    setTimeout(showMsg, 2000)
  })

  function showMsg() {
    document.getElementById('demo').innerHTML = '2 soniyadan keyin Salom!'
  }
</script>

Eslatma

setTimeout() metodi asinxron JavaScript-ning asosi bo'lib, asosiy bajarilish oqimini to'sib qo'ymasdan kod bajarilishini rejalashtirishga imkon beradi.

---

setInterval() metodi

setInterval() metodi funksiyani takroriy ravishda chaqiradi.

setInterval(function, delay, p1, ..., pN)

Parametrlar

Parametr	Tavsif
function	Majburiy. Har bir intervalda chaqiriladigan funksiya.
delay	Ixtiyoriy. Har bir funksiya chaqiruvi orasidagi millisekundlar. Standart 0.

Misol: Hisoblagich (Counter)

<button id="start">Boshlash</button>
<button id="stop">To'xtatish</button>
<p id="counter">0</p>

<script>
  let myInterval
  let count = 0

  document.getElementById('start').addEventListener('click', function () {
    myInterval = setInterval(counter, 1000)
  })

  document.getElementById('stop').addEventListener('click', function () {
    clearInterval(myInterval)
  })

  function counter() {
    count++
    document.getElementById('counter').innerHTML = count
  }
</script>

Eslatma

setTimeout() funksiyani kechikishdan keyin faqat bir marta bajaradi. setInterval() esa funksiyani har bir intervalda takroriy ravishda bajaradi.