Callback funksiyalar nima?

JuniorJavaScript #javascript #async #callbacks

Savol

Callback funksiya nima va u qayerda ishlatiladi?

Qisqa javob

Callback — boshqa funksiyaga argument sifatida uzatiladigan, keyinroq chaqiriladigan funksiya: darhol, asinxron amal tugagandan so'ng yoki hodisaga javoban.

Batafsil javob

Promise'lar paydo bo'lishidan oldin callback'lar asinxron JavaScript'ning bazaviy qurilish bloki edi. Odatiy stsenariylar:

  1. Asinxron amallar — ma'lumot tayyor bo'lganda funksiya chaqiriladi (server javobi, fayl o'qish).
  2. Hodisalarni qayta ishlash — bosish, kiritish va h.k. paytida brauzer funksiyani chaqiradi.
  3. Taymerlar — setTimeout/setInterval belgilangan vaqtdan so'ng callback'ni chaqiradi.

Callback yondashuvining asosiy muammosi — callback hell: bir nechta ketma-ket asinxron qadamlar zanjirida kod bir-birining ichiga joylashgan funksiyalar bilan o'ngga siljib boradi, bu o'qishni va xatolarni qayta ishlashni qiyinlashtiradi. Aynan shu narsa Promise, keyin esa async/await paydo bo'lishiga sabab bo'ldi.

Misol

// Callback bilan asinxron amal
function fetchData(url, callback) {
  fetch(url)
    .then(response => response.json())
    .then(data => callback(null, data))
    .catch(error => callback(error))
}

fetchData('/api/posts', (error, data) => {
  if (error) return console.error(error)
  console.log(data)
})

// Hodisalarni qayta ishlash
button.addEventListener('click', () => {
  console.log('Button clicked')
})

// Taymer
setTimeout(() => {
  console.log("2 soniya o'tdi")
}, 2000)

// Callback hell: bir nechta ketma-ket qadamlar
getUser(id, (user) => {
  getOrders(user.id, (orders) => {
    getOrderDetails(orders[0].id, (details) => {
      console.log(details) // har bir qadam bilan joylashuv chuqurlashadi
    })
  })
})

Qo'shimcha savollar

  • "Callback hell" nima va undan qanday qutulish mumkin?
  • Callback xatolarni qayta ishlash usuli bo'yicha Promise'dan nimasi bilan farq qiladi?
  • Error-first callback (Node.js konventsiyasi) nima?