एसिंक्रोनस फ़ंक्शंस की सीरियल कॉल

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

इसलिए, मैंने अपनी बैसाखी को विकसित किया, जो आपको स्पष्ट रूप से अतुल्यकालिक कार्यों को कॉल करने की अनुमति देता है जो निष्पादन के बाद कॉलबैक शुरू करते हैं। यह संभावना है कि समाधान लंबे समय से मौजूद है, लेकिन, दुर्भाग्य से, मुझे ऐसा कोई समाधान नहीं मिला।

युपीडी

नीचे मेरा समाधान है, जो कि async मॉड्यूल के इस फ़ंक्शन का एक एनालॉग है और टिप्पणियों में प्रस्तुत किए गए अन्य समान समाधानों का एक गुच्छा है। सभी को टिप्पणी करने और विशेष रूप से छेड़खानी करने के लिए धन्यवाद।
/ यूपीडी

आइए एक साइट के लिए एक काल्पनिक पार्सर के एक उदाहरण (जो सिर से लिया गया है और इसमें त्रुटियां संभव हैं) पर विचार करें, जो पार्स करने के बाद, डेटाबेस में डेटा दर्ज करता है, और प्रवेश करने के बाद, कुछ कोड को कॉल करता है।

var html = ''; request.on('response', function (response) { response.on('data', function (chunk) { html = html + chunk; }); response.on('end', function() { //-  parse(html, function(data){ //- ,     addToDatabase(data, function() { doSomething(); }) }); }); }); 

कई नेस्टेड कॉलबैक - कोई गुलजार नहीं है, हम अलग तरह से कोशिश करते हैं।

 var html = ''; var responceOnEnd = function() { parse(html, parsed); } var parsed = function(data){ addToDatabase(data, addedToDatabase) } var addedToDatabase = function() { doSomething(); } request.on('response', function (response) { response.on('data', function (chunk) { html = html + chunk; }); response.on('end', responceOnEnd); }); 

लेकिन यहां कुछ अतिरिक्त चर हैं जो भ्रमित हो सकते हैं।

मैं यह करने का सुझाव देता हूं:

 wait(function(runNext){ request.on('response', runNext); }).wait(function(runNext, response){ response.on('data', function (chunk) { html = html + chunk; }); response.on('end', function() { runNext(html); }); }).wait(function(runNext, html){ parse(html, runNext); }).wait(function(runNext, data){ addToDatabase(data, runNext); }).wait(function(){ doSomething(); }) 

रुचि रखते हैं? और आगे चलते हैं।

प्रतीक्षा करें।

 //first —  ,   wait = function(first){ //       return new (function(){ var self = this; var callback = function(){ var args; if(self.deferred.length) { /*       */ args = [].slice.call(arguments); /*    -     */ args.unshift(callback); //      self.deferred[0].apply(self, args); //     self.deferred.shift(); } } this.deferred = []; //    this.wait = function(run){ //      this.deferred.push(run); // this      return self; } first(callback); //   }); } 

मुझे यकीन नहीं है कि कोड और टिप्पणियां पारदर्शी हैं, मुझे कुछ सेकंड के लिए खुद सोचना होगा :)

स्पष्टता के लिए, मैंने कई अनुक्रमिक एनिमेशन बनाए:

  wait(function(runNext){ log('  '); $('#div1').animate({ top: 30 }, 1000, function(){ // -     runNext(1,2); }); }).wait(function(runNext, a, b){ //     log('  , a='+a+' b='+b ); $('#div2').animate({ top: 50 }, 1000, runNext); }).wait(function(runNext){ log('  '); setTimeout(function(){ log('  ') runNext(); }, 2000); }).wait(function(runNext){ log('  '); $('#div3').animate({ left: 50 }, 1000, runNext); }).wait(function(runNext){ log(' '); $('#div1').animate({ top: 0, left: 45 }, 1000, runNext); }).wait(function(){ log(''); }); 

JSFidle पर एक उदाहरण चलाएँ

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

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