Asinxron / Sinxron Proqramlaşdırma nədir? Niyə Callback funksiyasına ehtiyac duyuruq?
Salam, dostlar.
Niyə Callback funksiyasına ehtiyac duyuruq?
Funksiyanın icrası bitdikdən sonra başqa funksiyanı işə salan funksiyalara callback funksiyası deyilir.
Belədə deyə bilərik: Callback funksiyası hər hansı bir funksiyaya arqument olaraq ötürülən funksiyaya deyilir.
Callback funksiyalarını tədbiq etməzdən əvvəl sinxron və asinxron quruluşa nəzər salaq.
Sinxron: Javascript-də sinxron quruluşa görə kodlar ardıcıllıqla funksiyalara yerləşdirilir. Funksiyalar ardıcıl olaraq əməliyyatlarını bir-birinin ardınca yerinə yetirirlər.
Yuxarda gördüyünüz kimi, əvvəlcə name() və sonra number() funksiyasını çağırsam, konsol-da ‘Sabuhi Gasimov’ adı görünəcək, sonra konsolda ‘13246578’ yazılacaq.
Asinxron: Asinxron proqramlaşdırma deyildiyi zaman, insanlardan eşitəcəyiniz ilk şey bloklanmayan kod-dur. Yəni uzun bir işin bitməsini gözləmədən digər işlərin həyata keçməsinə Asinxron proqramlaşdırma deyə bilərik. Öncəliklə bunu qeyd etməliyəm ki, JavaScript Asinxron proqramlaşdırma məntiqi ilə işlədiyi üçün kod sətirləri bir birini gözləmədən işə düşür. Bunun qarşısını ala bilmək üçün Callback, Async/Await və Promise köməyimizə çatır.
İlk öncə ‘Callback’ funksiyasına aid bir misal göstəcəm və izahı onun üzərindən verəcəm .
Yuxarda yazdığım kod blokuna fikir versəz görəcəksiz ki, btn elemente biz click etdiyimiz zaman ilk olaraq setTimeout() funksiyasının çölündəki kod işə düşərək “Completed” yazısını ekrana yazdıracaq , sonra isə setTimeout() funksiyası işə düşəcək və 3 saniyyə sonra ikinci “Completed” yazısını ekrana yazdıracaq.
Yəni bir birini gözləmədən işə düşdülər.Biz bu prosesə asinxron proqramlama deyirik. Asinxron proqramlamada kodlar bir birini gözləmədən işə düşür əgər bir birini gözləyərək işə düşən kod bloklarımız olsaydı browser donaraq heç bir proses həyata keçirməyəcəkdi. Bu asinxron proqramlamanın məntiqini anlamaq üçün yazdığım ən sadə nümunə idi. İndi isə başqa bir nümunə ilə daha da ətraflı izah verməyə çalışacam.
Gördüyünüz kimi data adı altında bir arrayimiz var və getArray funksiyasının köməyi ilə biz həmin arrayin elementlərini ala bilirik. Və daha sonra ora yeni bir data əlavə etmək istədiyimiz zaman yeni bir funksiya yaradaraq ora yeni datanı push etsək hərşey normal olaraq işləyəcək. Amma push etdiyimiz data müəyyən zaman intervalından sonra gəlsə işə düşməyəcəkdi. Çünki ilk olaraq getArray() funksiyasi çağrıldığı üçün newData() funksiyasi işə düşməyəcəkdi. Elə bu səbəbdən Callback funkisyalar köməyimizə çatır.
Yuxarda gördüyünüz kimi qeyd etdiyim kodlara nəzər salsaz görəcəksiniz ki, Callback ilə push edəcəyimiz funksiyanın içərisinə bir funskiya daha yazırıq və onu parametr olaraq çağırırıq. Daha sonra isə ümumi datalarımızı çağırdığımız funksiyanı parametr olaraq yazırıq və istədiyimiz nəticəni alırıq.
Şəkil-2 də göründüyü kimi kodlarımız öz asinxronluğunu itirərək bir birini gözləyib 3 saniyyə sonra işə düşdü.
İndi isə size callback hell-den bəhs edəcəm, adındanda gordüyünüz kimi Geri çağırış (cəhənnəm) anlayışı callback funksiyaları daxilində asinxron funksiyaların dəfələrlə çağırılması ilə əmələ gələn qarışıq mühitə verilən addır :D
Nümünə:
Yuxarda gördüyünüz kimi, nəticəyə baxsaq xoş bir görüntü alırıq amma Kod hissesine baxsaq, oxunması çətin gələ bilər. Gəlin bunu Promise-lan tədbiq etməzdən əvvəl ilk öncə nə olduğunu öyrənək :)
Nədir Promise?
Promise, adından da göründüyünüz kimi, ingilis dilində söz vermək deməkdir. Gəlin promise izahını biraz normal həyatda qarşılaşdığımız hallarla baxaq məsəlləni tam və aydın başa düşək :D .
Tutaq ki, siz hamburger dükanına getdiniz və sifariş verdiniz. Kassir, həmçinin, sifarişinizi hazırladıqları zaman sizə xəbər vermək üçün kiçik bir aparat təqdim edir. Hal-hazırda, hamburger bizim üçün gələcək dəyərdir. Əlimizdə olan cihaz da bu dəyərə çatmaq üçün məkanın bizə verdiyi sözü (promise) təmsil edir. Cihaz bildiriş alana qədər gözləmə vəziyyətindədir (pending). Bildiriş gələndə hamburgerimiz uğurla hazırlandı (resolved), ya da ki, hamburger hazirlana bilməyib problem yaranıb uğursuz (rejected) bildirişi gəlir. Uğurlu olarsa, təbii ki, bəh-bəhlə yeyəcəksiniz. Uğursuz vəziyyət bir az daha xoşagəlməz olacaq. Kassirlə mübarizə aparmaq, məkanın sahibinə problemi bildirib şüvənlik edirsiz (error handling). Beləliklə məkan sahibi işləri paralel (sinxron) apara bilir.
Burada başqa bir sual yaranır. Callback və ya Promise ?
Burada olan çətin məqam əslində callback-ə güvənə bilərikmi? callback-lərimizi çağırmamış başqa bir yerdən çağrıla bilərmi (Başqa bir API funksiyasında məsələn) ? .
Callback-lərə çoxda güvənməməyimizin əsas səbəbləri aşağıdakılardır.
- Xətaların görsənməməsi.
- Callback-lərin zamanından tez çağrilması
- Lazım olan parametrləin doğru şəkildə almaması
- Callback-in heç çağrılmaması
- Callback-in gözləniləndən az və ya çox çağrılması.
Promise callback-lərin bu tipli sıxıntılı tərəflərini tamamlamaq üçün EcmaScript 6 ilə təklif edilən bir sistemdir.
Gəlin indi ise kod tərəfdən baxaq. Helə yuxarda çəkdiyimiz misala uyğun .. :D
Gördüyümüz kimi hamburgerin sifarişini verdik.
- Promise’ları new keyword ilə tanımlıyırıq.
- Uğurlu(resolve) ve Uğursuz (reject) vəziyyətlərdə çağırılacaq iki funksiya ilə birlikdə yaradırıq. (Bu iki funksiyaya müxtəlif adlar verə bilərsiniz, bir şərtlə ki!, onlar sırasını dəyişməsinlər, lakin bu adlara ümumiyyətlə üstünlük verilir.)
- Cavabı then funksiyası ilə alırıq. Bir dəqiqə bəs hər hansı bir yerdə problem yaransa necə xəbərimiz olacaq? O zaman söhbətə catch daxil olur. Əgər gedişatda problem olarsa catch funksiyası işləyəcək. Və yaranan problemin səbəbi həmin funksiyaya parametr kimi gələcək.
Indi gəlin yuxarda box olan elementi Promise-lan eliyək və burda da yekunlaşdıraq :D
54-cü sətirdə finally() metodu nədir bəs?) Bu uğurlu ya da uğursuz oldu tamamladıqda bu metod çağırılır.
Məndən bu qədər dostlar. Ümidvaram ki, sizlər üçün faydalı bir yazı olmuşdur. Oxuduğunuz üçün təşəkkürlər.
