खोज…
वेब ब्राउज़र में ईवेंट लूप
आधुनिक जावास्क्रिप्ट वातावरण का अधिकांश हिस्सा एक ईवेंट लूप के अनुसार काम करता है। यह कंप्यूटर प्रोग्रामिंग में एक सामान्य अवधारणा है जिसका अनिवार्य रूप से मतलब है कि आपका कार्यक्रम लगातार नई चीजों के होने की प्रतीक्षा करता है, और जब वे करते हैं, तो उन पर प्रतिक्रिया करता है। होस्ट प्रोग्राम आपके प्रोग्राम में कॉल करता है , जो ईवेंट लूप में "टर्न" या "टिक" या "टास्क" को स्पैन करता है, जो तब पूरा होता है । जब वह मोड़ समाप्त हो जाता है, तो मेजबान वातावरण कुछ और होने की प्रतीक्षा करता है, इससे पहले कि यह शुरू हो।
इसका एक सरल उदाहरण ब्राउज़र में है। निम्नलिखित उदाहरण पर विचार करें:
<!DOCTYPE html>
<title>Event loop example</title>
<script>
console.log("this a script entry point");
document.body.onclick = () => {
console.log("onclick");
};
setTimeout(() => {
console.log("setTimeout callback log 1");
console.log("setTimeout callback log 2");
}, 100);
</script>
इस उदाहरण में, होस्ट वातावरण वेब ब्राउज़र है।
- HTML पार्सर सबसे पहले
<script>निष्पादित करेगा। इसे पूरा करने के लिए चलेगा। -
setTimeoutका कॉल ब्राउज़र को बताता है कि, 100 मिलीसेकंड के बाद, उसे दिए गए कार्य को करने के लिए एक कार्य करना चाहिए। - इस बीच, इवेंट लूप तब लगातार जाँच के लिए ज़िम्मेदार होता है अगर वहाँ कुछ और करना है: उदाहरण के लिए, वेब पेज को रेंडर करना।
- 100 मिलीसेकंड के बाद, यदि घटना पाश किसी अन्य कारण से व्यस्त नहीं है, यह काम है कि देखेंगे
setTimeoutenqueues, और समारोह चलाने के लिए, उन दो बयानों प्रवेश करने। - किसी भी समय, यदि कोई व्यक्ति शरीर पर क्लिक करता है, तो ब्राउज़र क्लिक हैंडलर फ़ंक्शन को चलाने के लिए ईवेंट लूप में एक कार्य पोस्ट करेगा। ईवेंट लूप, जैसा कि यह लगातार जाँच करता है कि क्या करना है, इसे देखेंगे और उस फ़ंक्शन को चलाएंगे।
आप देख सकते हैं कि इस उदाहरण में जावास्क्रिप्ट कोड में कई अलग-अलग प्रकार के प्रवेश बिंदु हैं, जो ईवेंट लूप इनवोक करता है:
-
<script>एलिमेंट को तुरंत लागू किया जाता है - सेट
setTimeoutटास्क को इवेंट लूप में पोस्ट किया जाता है और एक बार चलाया जाता है - क्लिक हैंडलर कार्य को कई बार पोस्ट किया जा सकता है और हर बार चलाया जा सकता है
इवेंट लूप का प्रत्येक मोड़ कई चीजों के लिए जिम्मेदार है; उनमें से केवल कुछ ही इन जावास्क्रिप्ट कार्यों को लागू करेंगे। पूर्ण विवरण के लिए, HTML विनिर्देश देखें
एक आखिरी बात: हम यह कहकर क्या मतलब है कि प्रत्येक घटना पाश कार्य "पूरा करने के लिए चलाता है"? हमारा मतलब है कि आमतौर पर कोड के एक ब्लॉक को बाधित करना संभव नहीं है जो कि एक कार्य के रूप में चलाने के लिए कतारबद्ध है, और कोड के किसी अन्य ब्लॉक के साथ कोड को इंटरलेयर्ड चलाना संभव नहीं है। उदाहरण के लिए, यहां तक कि अगर आप सही समय पर क्लिक करते हैं, तो आप दो setTimeout callback log 1/2" बीच में "onclick" लॉग इन करने के लिए उपरोक्त कोड कभी नहीं प्राप्त कर सकते। यह कार्य-पोस्टिंग के काम करने के तरीके के कारण है; प्रीएम्पटिव के बजाय सहकारी और कतार-आधारित है।
अतुल्यकालिक संचालन और घटना लूप
आम जावास्क्रिप्ट प्रोग्रामिंग वातावरणों में कई दिलचस्प संचालन अतुल्यकालिक हैं। उदाहरण के लिए, ब्राउज़र में हम चीजों को देखते हैं
window.setTimeout(() => {
console.log("this happens later");
}, 100);
और Node.js में हम जैसी चीजें देखते हैं
fs.readFile("file.txt", (err, data) => {
console.log("data");
});
इवेंट लूप के साथ यह कैसे फिट होता है?
यह कैसे काम करता है कि जब ये कथन निष्पादित होते हैं, तो वे मेजबान वातावरण (जैसे, ब्राउज़र या Node.js रनटाइम, क्रमशः) को बंद करने और कुछ करने के लिए कहते हैं, शायद दूसरे धागे में। जब मेजबान वातावरण उस चीज़ को कर रहा होता है (क्रमशः 100 मिलीसेकंड प्रतीक्षा या फ़ाइल file.txt पढ़ने) तो यह इवेंट लूप को एक कार्य पोस्ट करेगा, यह कहते हुए कि "कॉलबैक मैं पहले इन तर्कों के साथ दिया गया था"।
इवेंट लूप तब अपनी बात करने में व्यस्त है: वेबपेज को प्रस्तुत करना, उपयोगकर्ता इनपुट के लिए सुनना और लगातार पोस्ट किए गए कार्यों की तलाश करना। जब यह कॉलबैक कॉल करने के लिए इन पोस्ट किए गए कार्यों को देखता है, तो यह जावास्क्रिप्ट में वापस कॉल करेगा। इसी तरह आपको अतुल्यकालिक व्यवहार मिलता है!