მითხარი მოვლენების ციკლზე (event loop).

მოვლენების ციკლი არის JavaScript-ის ასინქრონული მუშაობის საფუძველი. იგი აკონტროლებს კოდის შესრულებას, მოვლენების დამუშავებას და გარეგანი სამყაროსთან ურთიერთქმედებას.

ძირითადი კომპონენტები:

• Heap (Heap): მეხსიერების ტერიტორია ობიექტების განაწილებისთვის.
• Stack (Stack): ადგილი, სადაც ინახება ფუნქციების შესრულების კონტექსტები. როდესაც ფუნქცია იძახება, იგი Stack-ზე იდება, და დასრულებისას — ამოიღება.
• Web API: ინტერფეისები, რომლებიც ბრაუზერმა უზრუნველყოფს (DOM, AJAX, Timers და სხვა). ისინი მართავენ ასინქრონულ ოპერაციებს.
• Callback Queue (Callback რიგი): შეტყობინებების რიგი, რომელიც დაკავშირებულია მოვლენებთან. Web API-ები აქ აყენებენ დასრულებული ასინქრონული ოპერაციების callback-ებს.
• მოვლენების ციკლი (Event Loop): მუდმივად აკონტროლებს Stack-ს და callback რიგს. თუ Stack ცარიელია, იღებს პირველ callback-ს და აყენებს მას შესრულებისთვის Stack-ზე.

პროცესი:

1. სინქრონული კოდი შესრულდება Stack-ზე.
2. ასინქრონული ოპერაციები (setTimeout, fetch) გადაეცემა Web API-ებს.
3. როდესაც ასინქრონული ოპერაცია დასრულდება, მისი callback-ი გადადის callback რიგში.
4. მოვლენების ციკლი ელოდება, სანამ Stack ცარიელი გახდება.
5. როდესაც Stack ცარიელია, მოვლენების ციკლი იღებს პირველ callback-ს და აყენებს მას Stack-ზე, სადაც ის შესრულდება.

მაგალითი setTimeout-თან:

console.log('დაწყება');

setTimeout(() => {
  console.log('setTimeout-ის შიგნით');
}, 0);

console.log('დასასრული');

შედეგი:

დაწყება
დასასრული
setTimeout-ის შიგნით

მიუხედავად 0 მლს-ის დროის, setTimeout callback-ი შესრულდება სინქრონული კოდის შემდეგ, რადგან ის გადადის რიგში და ელოდება Stack-ის გამოტენას.

Node.js-შიც არსებობს მოვლენების ციკლი, მაგრამ გარკვეული განსხვავებებით რიგების დამუშავების ფაზებში.