जावास्क्रिप्ट में अतुल्यकालिक प्रोग्रामिंग के बारे में बताया

सभी को नमस्कार!

जैसा कि आप याद कर सकते हैं, अक्टूबर में वापस हम जावास्क्रिप्ट में टाइमर का उपयोग करने के बारे में एक दिलचस्प लेख का अनुवाद कर रहे थे। इसने एक बड़ी चर्चा का कारण बना, जिसके परिणामों के अनुसार हम लंबे समय से इस विषय पर लौटना चाहते हैं और आपको इस भाषा में अतुल्यकालिक प्रोग्रामिंग का विस्तृत विश्लेषण प्रदान करते हैं। हमें खुशी है कि हम सभ्य सामग्री खोजने में कामयाब रहे और इसे वर्ष के अंत से पहले प्रकाशित किया। अच्छा पढ़ लो!

जावास्क्रिप्ट में एसिंक्रोनस प्रोग्रामिंग एक मल्टी-स्टेज इवोल्यूशन से गुज़री है: कॉलबैक से लेकर वादे और आगे जनरेटर तक, और जल्द ही async/await । प्रत्येक स्तर पर, जावास्क्रिप्ट में एसिंक्रोनस प्रोग्रामिंग उन लोगों के लिए थोड़ा सरल था, जिन्होंने पहले से ही इस भाषा में अपना रास्ता बदल दिया था, लेकिन शुरुआती लोगों के लिए यह केवल अधिक भयावह हो गया, क्योंकि प्रत्येक प्रतिमान की बारीकियों को समझना आवश्यक था, प्रत्येक के आवेदन में महारत हासिल करना और, कम महत्वपूर्ण नहीं, समझने के लिए। यह सब कैसे काम करता है।

इस लेख में, हमने कॉलबैक और वादों का उपयोग करने, जनरेटर को एक संक्षिप्त परिचय देने का संक्षिप्त रूप से याद करने का फैसला किया, और फिर आपको सहज रूप से यह समझने में मदद करते हैं कि जनरेटर और async / प्रतीक्षा के साथ "हुड के तहत" अतुल्यकालिक प्रोग्रामिंग की व्यवस्था कैसे की जाती है। हम आशा करते हैं कि इस तरह से आप आत्मविश्वास से विभिन्न प्रतिमानों को ठीक उसी जगह लागू कर सकते हैं जहाँ वे उपयुक्त हैं।

यह माना जाता है कि पाठक पहले से ही अतुल्यकालिक प्रोग्रामिंग के लिए कॉलबैक, वादे और जनरेटर का उपयोग कर चुके हैं, और जावास्क्रिप्ट में करीबी और करीने से भी काफी परिचित हैं।

कॉलबैक नरक

प्रारंभ में, कॉलबैक थे। जावास्क्रिप्ट में सिंक्रोनस I / O नहीं होता है (बाद में I / O के रूप में संदर्भित किया जाता है) और ब्लॉकिंग का समर्थन नहीं किया जाता है। इसलिए, किसी भी I / O के आयोजन के लिए या किसी कार्रवाई को स्थगित करने के लिए, ऐसी रणनीति को चुना गया था: जिस कोड को असिंक्रोनस रूप से निष्पादित किया जाना आवश्यक था, वह फ़ंक्शन को आस्थगित निष्पादन के साथ पारित किया गया था, जो इवेंट लूप में नीचे कहीं लॉन्च किया गया था। एक कॉलबैक इतना बुरा नहीं है, लेकिन कोड बढ़ता है, और कॉलबैक आमतौर पर नए कॉलबैक को जन्म देते हैं। परिणाम कुछ इस प्रकार है:

 getUserData(function doStuff(e, a) { getMoreUserData(function doMoreStuff(e, b) { getEvenMoreUserData(function doEvenMoreStuff(e, c) { getYetMoreUserData(function doYetMoreStuff(e, c) { console.log('Welcome to callback hell!'); }); }); }); }) 

इस तरह के भग्न कोड को देखने पर हंस से टकराता है, एक और समस्या है: अब हमने अपने do*Stuff का नियंत्रण do*Stuff अन्य कार्यों के लिए तर्क तर्क ( get*UserData() , जिसमें आप स्रोत कोड नहीं हो सकता है, और आप नहीं हो सकता है यकीन है कि अगर वे आपके कॉलबैक प्रदर्शन कर रहे हैं। महान, है ना?

वादा

वादे कॉलबैक द्वारा प्रदान किए गए नियंत्रण के व्युत्क्रम को उलट देते हैं और एक चिकनी श्रृंखला में कॉलबैक की एक उलझन को उजागर करने में मदद करते हैं।
अब पिछले उदाहरण को कुछ इस तरह परिवर्तित किया जा सकता है:

 getUserData() .then(getUserData) .then(doMoreStuff) .then(getEvenMoreUserData) .then(doEvenMoreStuff) .then(getYetMoreUserData) .then(doYetMoreStuff); 

पहले से ही इतना बदसूरत नहीं, हुह?

लेकिन, मुझे जाने दो !!! आइए एक अधिक महत्वपूर्ण (लेकिन अभी भी काफी हद तक वंचित) कॉलबैक उदाहरण देखें:

 // ,     fetchJson(),   GET   , //    :         ,     –   // . function fetchJson(url, callback) { ... } fetchJson('/api/user/self', function(e, user) { fetchJson('/api/interests?userId=' + user.id, function(e, interests) { var recommendations = []; interests.forEach(function () { fetchJson('/api/recommendations?topic=' + interest, function(e, recommendation) { recommendations.push(recommendation); if (recommendations.length == interests.length) { render(profile, interests, recommendations); } }); }); }); }); 

इसलिए, हम उपयोगकर्ता के प्रोफाइल का चयन करते हैं, फिर उसकी रुचियों के आधार पर, फिर उसकी रुचियों के आधार पर, हम सिफारिशों का चयन करते हैं और अंत में, सभी सिफारिशों को एकत्र करते हुए, हम पृष्ठ प्रदर्शित करते हैं। कॉलबैक का ऐसा सेट, जो, शायद, गर्व हो सकता है, लेकिन, फिर भी, यह किसी तरह से झबरा है। कुछ भी नहीं, यहां वादे लागू करें - और सब कुछ काम करेगा। है न?

आइए हमारे fetchJson() पद्धति को बदलें ताकि यह कॉलबैक स्वीकार करने के बजाय एक वादा लौटाए। एक वादा JSON प्रारूप में पार्स की गई प्रतिक्रिया निकाय द्वारा हल किया जाता है।

 fetchJson('/api/user/self') .then(function (user) { return fetchJson('/api/user/interests?userId=' + self.id); }) .then(function (interests) { return Promise.all[interests.map(i => fetchJson('/api/recommendations?topic=' + i))]; }) .then(function (recommendations) { render(user, interests, recommendations); }); 

अच्छा लगा ना? अब इस कोड में क्या गलत है?

… उफ़! ..
हमारे पास इस श्रृंखला के अंतिम कार्य में प्रोफ़ाइल या रुचियों तक पहुँच नहीं है? तो कुछ भी काम नहीं करता! क्या करें? चलो नेस्टेड वादों की कोशिश करें:

 fetchJson('/api/user/self') .then(function (user) { return fetchJson('/api/user/interests?userId=' + self.id) .then(interests => { user: user, interests: interests }); }) .then(function (blob) { return Promise.all[blob.interests.map(i => fetchJson('/api/recommendations?topic=' + i))] .then(recommendations => { user: blob.user, interests: blob.interests, recommendations: recommendations }); }) .then(function (bigBlob) { render(bigBlob.user, bigBlob.interests, bigBlob.recommendations); }); 

हाँ ... अब यह बहुत अधिक भद्दा लगता है जितना हमने उम्मीद की थी। क्या इस तरह के पागल घोंसले के शिकार गुड़िया के कारण है कि हम कॉलबैक के नरक से बाहर निकलने के लिए आखिरी, लेकिन कम से कम नहीं चाहते हैं? अब क्या करें?

कोड को थोड़ा कंघी किया जा सकता है, बंद होने पर झुकाव:

 //   ,     var user, interests; fetchJson('/api/user/self') .then(function (fetchedUser) { user = fetchedUser; return fetchJson('/api/user/interests?userId=' + self.id); }) .then(function (fetchedInterests) { interests = fetchedInterests; return Promise.all(interests.map(i => fetchJson('/api/recommendations?topic=' + i))); }) .then(function (recomendations) { render(user, interests, recommendations); }) .then(function () { console.log('We are done!'); }); 

हां, अब सब कुछ व्यावहारिक रूप से हम चाहते थे, लेकिन एक quirk के साथ। ध्यान दें कि हमने user और interests बजाय, fetchedUser और fetchedInterests में कॉलबैक के अंदर तर्क कैसे कहा? यदि ऐसा है, तो आप बहुत चौकस हैं!

इस दृष्टिकोण का दोष यह है: आपको आंतरिक कार्यों में कुछ भी नाम न रखने के लिए बहुत सावधानी बरतने की आवश्यकता है, साथ ही कैश से वे चर जिन्हें आप अपने बंद करने में उपयोग करने जा रहे हैं। यहां तक ​​कि अगर आपके पास शेडिंग से बचने के लिए नैक है, तो क्लोजर में एक वेरिएबल को संदर्भित करना अभी भी बहुत खतरनाक लगता है, और यह निश्चित रूप से अच्छा है।

अतुल्यकालिक जेनरेटर

जेनरेटर करेंगे मदद! यदि आप जनरेटर का उपयोग करते हैं, तो सभी उत्साह गायब हो जाते हैं। बस जादू है। सच तो यह है। केवल एक नज़र डालें:

 co(function* () { var user = yield fetchJson('/api/user/self'); var interests = yield fetchJson('/api/user/interests?userId=' + self.id); var recommendations = yield Promise.all( interests.map(i => fetchJson('/api/recommendations?topic=' + i))); render(user, interests, recommendations); }); 

वह सब है। यह काम करेगा। जब आप देखते हैं कि जनरेटर कितने सुंदर हैं, तो आप एक आंसू में नहीं फूटेंगे, क्या आपको इस बात का अफसोस है कि आप इतने अदूरदर्शी थे और जनरेटर के सामने आने से पहले ही जावास्क्रिप्ट सीखना शुरू कर दिया था? मैं मानता हूं, ऐसा विचार मुझे एक बार आया था।
लेकिन ... यह सब कैसे काम करता है? वास्तव में जादू?

जरूर! .. नहीं। हम एक्सपोजर की ओर मुड़ते हैं।

जनरेटर

हमारे उदाहरण में, ऐसा लगता है कि जनरेटर का उपयोग करना आसान है, लेकिन वास्तव में उनमें बहुत कुछ चल रहा है। अतुल्यकालिक जनरेटर को अधिक विस्तार से समझने के लिए, आपको बेहतर ढंग से समझने की आवश्यकता है कि जनरेटर कैसे काम करते हैं और वे कैसे अतुल्यकालिक निष्पादन प्रदान करते हैं, जो तुल्यकालिक लगता है।

जैसा कि नाम से ही स्पष्ट है, जनरेटर मूल्य बनाता है:

 function* counts(start) { yield start + 1; yield start + 2; yield start + 3; return start + 4; } const counter = counts(0); console.log(counter.next()); // {value: 1, done: false} console.log(counter.next()); // {value: 2, done: false} console.log(counter.next()); // {value: 3, done: false} console.log(counter.next()); // {value: 4, done: true} console.log(counter.next()); // {value: undefined, done: true} 

यह बहुत आसान है, लेकिन वैसे भी, चलो यहाँ क्या हो रहा है के बारे में बात करते हैं:

1. const counter = counts(); - जनरेटर को इनिशियलाइज़ करें और इसे वेरिएबल काउंटर में सेव करें। जनरेटर लिम्बो में है, जनरेटर बॉडी में कोई कोड अभी तक निष्पादित नहीं किया गया है।
2. console.log(counter.next()); - आउटपुट की व्याख्या ( yield ) 1, जिसके बाद 1 को value रूप में लौटाया जाता है, और परिणाम में false done , क्योंकि आउटपुट वहां समाप्त नहीं होता है
3. console.log(counter.next()); - अब १!
4. console.log(counter.next()); - अब १! हम समाप्त हो गया। क्या सब कुछ सही है? नहीं। निष्पादन चरण yield 3; में रुका हुआ है yield 3; पूरा करने के लिए, आपको अगले () फिर से कॉल करने की आवश्यकता है।
5. console.log(counter.next()); - अब 4, और यह लौटता है, लेकिन जारी नहीं किया जाता है, इसलिए अब हम फ़ंक्शन से बाहर निकलते हैं, और सब कुछ तैयार है।
6. console.log(counter.next()); - जनरेटर का काम खत्म हो गया है! उसके पास रिपोर्ट करने के लिए कुछ भी नहीं है सिवाय इसके कि "सब कुछ किया जाता है।

इसलिए हमने यह पता लगाया कि जनरेटर कैसे काम करते हैं! लेकिन रुको, एक चौंकाने वाला सच: जनरेटर न केवल मूल्यों को उगल सकता है, बल्कि उन्हें खा भी सकता है!

 function* printer() { console.log("We are starting!"); console.log(yield); console.log(yield); console.log(yield); console.log("We are done!"); } const counter = printer(); counter.next(1); // ! counter.next(2); // 2 counter.next(3); // 3 counter.next(4); // 4\n ! counter.next(5); //    

काहे, क्या ?! एक जनरेटर मूल्यों की खपत करता है, बजाय उन्हें स्पॉन करने के। यह कैसे संभव है?

रहस्य next समारोह में है। यह न केवल जनरेटर से मान लौटाता है, बल्कि उन्हें जनरेटर को भी लौटा सकता है। यदि आप next() तर्क को बताते हैं, तो yield ऑपरेशन, जिसका जनरेटर वर्तमान में इंतजार कर रहा है, वास्तव में तर्क का परिणाम है। यही कारण है कि पहला counter.next(1) undefined रूप counter.next(1) पंजीकृत है। बस कोई प्रत्यर्पण नहीं है जिसे हल किया जा सके।

यह वैसा ही है जैसे कि जनरेटर ने कॉलिंग कोड (प्रक्रिया) और जेनरेटर कोड (प्रक्रिया) को एक-दूसरे के साथ भागीदार बनाने की अनुमति दी ताकि वे एक दूसरे को मान दें क्योंकि वे निष्पादित किए गए थे और एक-दूसरे के लिए प्रतीक्षा करें। स्थिति व्यावहारिक रूप से वैसी ही है, जैसे कि यदि जावास्क्रिप्ट जनरेटर के लिए सहकारी प्रतिस्पर्धात्मक रूप से निष्पादित प्रक्रियाओं को लागू करने की संभावना रखते हैं, तो वे "कॉरआउट" भी होते हैं। वास्तव में, बहुत ज्यादा co() , ठीक है?

लेकिन चलो जल्दी मत करो, नहीं तो हम खुद को पछाड़ देंगे। इस मामले में, यह महत्वपूर्ण है कि पाठक सहज रूप से जनरेटर और एसिंक्रोनस प्रोग्रामिंग के सार को समझ ले, और ऐसा करने का सबसे अच्छा तरीका जनरेटर खुद को इकट्ठा करना है। एक जनरेटर फ़ंक्शन न लिखें और समाप्त एक का उपयोग न करें, लेकिन जनरेटर फ़ंक्शन के इंटीरियर को खुद को फिर से बनाएं।

जनरेटर का आंतरिक उपकरण - हम जनरेटर उत्पन्न करते हैं

ठीक है, मुझे वास्तव में पता नहीं है कि जेएस के अलग-अलग रनटाइम में जेनरेटर इंटर्नल्स बिल्कुल कैसे दिखते हैं। लेकिन यह इतना महत्वपूर्ण नहीं है। जेनरेटर इंटरफ़ेस के अनुरूप हैं। जेनरेटर को इंस्टेंट करने के लिए एक "कंस्ट्रक्टर", next(value? : any) विधि, जिसके साथ हम जेनरेटर को काम जारी रखने और उसे मान देने का आदेश देते हैं, एक मान के बजाय एक और throw(error) विधि उत्पन्न throw(error) , और अंत में, एक विधि return() , जो अभी भी चुप है। यदि इंटरफ़ेस का अनुपालन किया जाता है, तो सब कुछ ठीक है।

तो, आइए कीवर्ड function* बिना, शुद्ध ES5 पर उपरोक्त counts() जनरेटर का निर्माण करने का प्रयास करें। अभी के लिए, आप throw() को अनदेखा कर सकते हैं और वैल्यू को next() पास कर सकते हैं, क्योंकि विधि किसी इनपुट को स्वीकार नहीं करती है। यह कैसे करना है?

लेकिन जावास्क्रिप्ट में, कार्यक्रम के निष्पादन को रोकने और फिर से शुरू करने के लिए एक और तंत्र है: बंद! क्या यह परिचित दिखता है?

 function makeCounter() { var count = 1; return function () { return count++; } } var counter = makeCounter(); console.log(counter()); // 1 console.log(counter()); // 2 console.log(counter()); // 3 

यदि आपने पहले बंद किया था, तो मुझे यकीन है कि आपने पहले से ही ऐसा कुछ लिखा है। मेक एनकाउंटर द्वारा लौटाया गया फ़ंक्शन एक जनरेटर की तरह संख्याओं का अनंत अनुक्रम उत्पन्न कर सकता है।

हालांकि, यह फ़ंक्शन जनरेटर इंटरफ़ेस के अनुरूप नहीं है, और इसे सीधे हमारे उदाहरण में counts() साथ लागू नहीं किया जा सकता है, जो 4 मानों और रिटर्न से बाहर निकलता है। जनरेटर जैसे कार्यों के लिए एक सार्वभौमिक दृष्टिकोण के लिए क्या आवश्यक है?

क्लोजर, राज्य मशीन, और कठिन श्रम!

 function counts(start) { let state = 0; let done = false; function go() { let result; switch (state) { case 0: result = start + 1; state = 1; break; case 1: result = start + 2; state = 2; break; case 2: result = start + 3; state = 3; break; case 3: result = start + 4; done = true; state = -1; break; default: break; } return {done: done, value: result}; } return { next: go } } const counter = counts(0); console.log(counter.next()); // {value: 1, done: false} console.log(counter.next()); // {value: 2, done: false} console.log(counter.next()); // {value: 3, done: false} console.log(counter.next()); // {value: 4, done: true} console.log(counter.next()); // {value: undefined, done: true} 

इस कोड को चलाने से, आपको जनरेटर के साथ संस्करण के समान परिणाम दिखाई देंगे। अच्छा लगा ना?
इसलिए, हमने जनरेटर के निर्माण पक्ष को छांटा; चलो खपत का विश्लेषण करते हैं?
वास्तव में, कई अंतर नहीं हैं।

 function printer(start) { let state = 0; let done = false; function go(input) { let result; switch (state) { case 0: console.log("We are starting!"); state = 1; break; case 1: console.log(input); state = 2; break; case 2: console.log(input); state = 3; break; case 3: console.log(input); console.log("We are done!"); done = true; state = -1; break; default: break; return {done: done, value: result}; } } return { next: go } } const counter = printer(); counter.next(1); // ! counter.next(2); // 2 counter.next(3); // 3 counter.next(4); // 4 counter.next(5); // ! 

सभी की जरूरत है कि input को go तर्क के रूप में जोड़ा जाए, और मानों को बाहर निकाला जाए। फिर से जादू लगता है? लगभग जनरेटर की तरह?

हुर्रे! इसलिए हमने एक आपूर्तिकर्ता के रूप में और एक उपभोक्ता के रूप में जनरेटर को फिर से बनाया। इसमें इन कार्यों को संयोजित करने का प्रयास क्यों नहीं किया गया? यहाँ एक जनरेटर का एक और सुंदर कृत्रिम उदाहरण है:

 function* adder(initialValue) { let sum = initialValue; while (true) { sum += yield sum; } } 

चूँकि हम जेनरेटर के सभी विशेषज्ञ हैं, हम समझते हैं कि यह जनरेटर next(value) मूल्य में दिए गए next(value) को sum देता है, और फिर राशि देता है। यह वैसा ही काम करता है जैसा हम उम्मीद करते हैं:

 const add = adder(0); console.log(add.next()); // 0 console.log(add.next(1)); // 1 console.log(add.next(2)); // 3 console.log(add.next(3)); // 6 

कूल। अब इस इंटरफ़ेस को एक सामान्य फ़ंक्शन के रूप में लिखते हैं!

 function adder(initialValue) { let state = 'initial'; let done = false; let sum = initialValue; function go(input) { let result; switch (state) { case 'initial': result = initialValue; state = 'loop'; break; case 'loop': sum += input; result = sum; state = 'loop'; break; default: break; } return {done: done, value: result}; } return { next: go } } function runner() { const add = adder(0); console.log(add.next()); // 0 console.log(add.next(1)); // 1 console.log(add.next(2)); // 3 console.log(add.next(3)); // 6 } runner(); 

वाह, हमने एक पूर्ण-संपन्न कॉरुटाइन लागू किया है।

जनरेटर के संचालन के बारे में चर्चा करने के लिए अभी भी कुछ है। अपवाद कैसे काम करते हैं? जनरेटर के अंदर होने वाले अपवादों के साथ, सब कुछ सरल है: next() कॉल करने वाले तक पहुंच बना देगा और जनरेटर मर जाएगा। जनरेटर के लिए एक अपवाद पारित करना throw() विधि में किया जाता है, जिसे हमने ऊपर छोड़ दिया था।

आइए एक शांत नई सुविधा के साथ हमारे टर्मिनेटर को समृद्ध करें। यदि कॉलर जनरेटर के अपवाद को पास करता है, तो यह राशि के अंतिम मूल्य पर वापस आ जाएगा।

 function* adder(initialValue) { let sum = initialValue; let lastSum = initialValue; let temp; while (true) { try { temp = sum; sum += yield sum; lastSum = temp; } catch (e) { sum = lastSum; } } } const add = adder(0); console.log(add.next()); // 0 console.log(add.next(1)); // 1 console.log(add.next(2)); // 3 console.log(add.throw(new Error('BOO)!'))); // 1 console.log(add.next(4)); // 5 

प्रोग्रामिंग समस्या - जेनरेटर त्रुटि प्रवेश

कॉमरेड, हम थ्रो कैसे लागू करते हैं ()?

आसानी से! त्रुटि सिर्फ एक और मूल्य है। हम इसे अगले तर्क के रूप में go() पास कर सकते हैं। वास्तव में, यहां थोड़ी सावधानी की जरूरत है। जब throw(e) कहा जाता है, तो yield उसी तरह काम करेगा जैसे कि हमने थ्रो ई लिखा था। इसका मतलब यह है कि हमें अपने राज्य मशीन की हर स्थिति की त्रुटियों की जांच करनी चाहिए, और यदि हम त्रुटि को संभाल नहीं सकते हैं तो प्रोग्राम को क्रैश कर दें।

चलिए टर्मिनेटर के पिछले कार्यान्वयन के साथ शुरू करते हैं, कॉपी किया गया है

टेम्पलेट

निर्णय

बूम! हमने कॉरआउट का एक सेट लागू किया है जो एक वास्तविक जनरेटर की तरह एक दूसरे को संदेश और अपवाद पारित करने में सक्षम हैं।

लेकिन स्थिति बदतर हो रही है, है ना? जनरेटर के कार्यान्वयन से राज्य मशीन का कार्यान्वयन तेजी से दूर हो रहा है। इतना ही नहीं, त्रुटि से निपटने के कारण, कोड को कचरे से बंद कर दिया जाता है; कोड हमारे द्वारा यहां दिए गए लंबे while कारण सभी अधिक जटिल है। while को बदलने के लिए while आपको इसे राज्यों में "अनटंगल" करने की आवश्यकता है। तो, हमारे मामले 1 में वास्तव में while 2.5 पुनरावृत्तियों शामिल हैं, क्योंकि yield बीच में टूट जाती है। अंत में, आपको कॉलर से अपवादों को धकेलने के लिए अतिरिक्त कोड जोड़ना होगा और इसके अपवाद को संभालने के लिए जनरेटर में कोई try/catch नहीं है।

आपने कर दिया !!! हमने जनरेटर के कार्यान्वयन के लिए संभावित विकल्पों का एक विस्तृत विश्लेषण पूरा कर लिया है और मुझे उम्मीद है, आप पहले से ही बेहतर समझ चुके हैं कि जनरेटर कैसे काम करते हैं। सूखे अवशेषों में:

• एक जनरेटर मान उत्पन्न कर सकता है, मूल्यों का उपभोग कर सकता है, या दोनों।
• जनरेटर की स्थिति को रोका जा सकता है (राज्य, राज्य मशीन, कैच?)
• कॉलर और जनरेटर आपको एक दूसरे के साथ बातचीत करते हुए, कोरुटिन का एक सेट बनाने की अनुमति देते हैं
• अपवाद किसी भी दिशा में अग्रेषित किए जाते हैं।

अब जब हमारे पास जनरेटर की बेहतर समझ है, तो मैं उनके बारे में तर्क करने का एक संभावित सुविधाजनक तरीका प्रस्तावित करता हूं: ये वाक्य रचना हैं जिनके साथ आप प्रतिस्पर्धात्मक रूप से निष्पादित प्रक्रियाएं लिख सकते हैं जो एक चैनल के माध्यम से एक-दूसरे को मान देते हैं जो एक समय में एक मान देता है ( yield )। यह अगले भाग में काम आएगा, जहां हम कोरटाइन से co() कार्यान्वयन का उत्पादन करेंगे।

कॉरटीन नियंत्रण उलटा

अब जब हम जनरेटर के साथ काम करने में कुशल हैं, तो आइए इस बारे में सोचें कि उन्हें अतुल्यकालिक प्रोग्रामिंग में कैसे उपयोग किया जा सकता है। यदि हम जनरेटर को इस तरह लिख सकते हैं, तो इसका मतलब यह नहीं है कि जनरेटर में वादे स्वचालित रूप से हल हो जाएंगे। लेकिन रुको, जनरेटर अपने दम पर काम करने के लिए नहीं हैं। उन्हें एक अन्य कार्यक्रम, मुख्य प्रक्रिया, जिसे कॉल करना है, के साथ बातचीत करनी चाहिए .next() और .throw() ।

क्या होगा यदि हम अपने व्यावसायिक तर्क को मुख्य प्रक्रिया में नहीं, बल्कि जनरेटर में रखते हैं? जब भी एक निश्चित अतुल्यकालिक मूल्य होता है, तो व्यापार तर्क के लिए एक वादे की तरह, जनरेटर कहेगा: "मैं इस बकवास के साथ गड़बड़ नहीं करना चाहता, जब यह हल हो जाए तो मुझे जगाओ", सेवा की प्रक्रिया के लिए एक वादा जारी करेगा और जारी करेगा। रखरखाव प्रक्रिया: "ठीक है, मैं आपको बाद में कॉल करूंगा।" जिसके बाद यह इस वादे के साथ एक कॉलबैक पंजीकृत करता है, बाहर निकलता है और तब तक इंतजार करता है जब तक कि घटनाओं के चक्र को ट्रिगर करना संभव न हो (अर्थात, जब वादा हल हो जाए)। जब ऐसा होता है, तो प्रक्रिया "हे, यह आपकी बारी है," की घोषणा करेगी और सो रहे जनरेटर .next() माध्यम से मूल्य भेज .next() । वह अपना काम करने के लिए जनरेटर की प्रतीक्षा करेगी, और इस बीच यह अन्य अतुल्यकालिक चीजें करेगा ... और इसी तरह। आपने एक दुखद कहानी सुनी कि कैसे प्रक्रिया एक जनरेटर की सेवा पर रहती है।

तो, मुख्य विषय पर वापस जाएं। अब जब हम जानते हैं कि जनरेटर और वादे कैसे काम करते हैं, तो हमारे लिए इस तरह की "सेवा प्रक्रिया" बनाना मुश्किल नहीं होगा। सेवा प्रक्रिया को एक वादे के रूप में प्रतिस्पर्धात्मक रूप से निष्पादित किया जाएगा, जनरेटर को इंस्टेंट करने और बनाए रखने के लिए, और फिर .then() कॉलबैक का उपयोग करके हमारी मुख्य प्रक्रिया के अंतिम परिणाम पर लौटें।

अगला, चलो सह () कार्यक्रम पर लौटते हैं और इस पर अधिक विस्तार से चर्चा करते हैं। co() एक सेवा प्रक्रिया है जो दास श्रम पर ले जाती है ताकि जनरेटर केवल तुल्यकालिक मूल्यों के साथ काम कर सके। पहले से ही बहुत अधिक तार्किक लगता है, है ना?

 co(function* () { var user = yield fetchJson('/api/user/self'); var interests = yield fetchJson('/api/user/interests?userId=' + self.id); var recommendations = yield Promise.all( interests.map(i => fetchJson('/api/recommendations?topic=' + i))); render(user, interests, recommendations); }); 

, , co() , .

— co()

बहुत बढ़िया! co() , , . co()

1. ,
3. .next() , {done: false, value: [a Promise]}
5. ( ), .next() ,
6. , 4
7. - {done: true, value: ...} , , co()

, co(), :

 function deferred(val) { return new Promise((resolve, reject) => resolve(val)); } co(function* asyncAdds(initialValue) { console.log(yield deferred(initialValue + 1)); console.log(yield deferred(initialValue + 2)); console.log(yield deferred(initialValue + 3)); }); function co(generator) { return new Promise((resolve, reject) => { //   }); } 

, ? - 10 co() , . , . ?

– co()

, , , , co() . , .throw() .

 function deferred(val) { return new Promise((resolve, reject) => resolve(val)); } function deferReject(e) { return new Promise((resolve, reject) => reject(e)); } co(function* asyncAdds() { console.log(yield deferred(1)); try { console.log(yield deferredError(new Error('To fail, or to not fail.'))); } catch (e) { console.log('To not fail!'); } console.log(yield deferred(3)); }); function co(generator) { return new Promise((resolve, reject) => { //   }); } 

. , , .next() onResolve() . onReject() , .throw() . try/catch , , try/catch .

, co() ! ! co() , , , . , ?

: async/await

co() . - , async/await? — ! , async await .

async , await , yield . await , async . async - .

, async/await , , - co() async yield await , * , .

 co(function* () { var user = yield fetchJson('/api/user/self'); var interests = yield fetchJson('/api/user/interests?userId=' + self.id); var recommendations = yield Promise.all( interests.map(i => fetchJson('/api/recommendations?topic=' + i))); render(user, interests, recommendations); }); 

:

 async function () { var user = await fetchJson('/api/user/self'); var interests = await fetchJson('/api/user/interests?userId=' + self.id); var recommendations = await Promise.all( interests.map(i => fetchJson('/api/recommendations?topic=' + i))); render(user, interests, recommendations); }(); 

, :

• co() . async , . async co() co.wrap() .
• co() ( yield ) , , . async ( await ) .

Javascript , , « » co() , , , async/await . ? यह सही है।