जावास्क्रिप्ट वादों और एसिंक्स वेट के बीच क्या अंतर है?


95

मैं अपने अनुप्रयोगों में ECMAScript 6 और ECMAScript 7 सुविधाओं का पहले से ही (बैबल के लिए धन्यवाद) उपयोग कर रहा हूं - मोबाइल और वेब दोनों।

पहला चरण स्पष्ट रूप से ECMAScript 6 स्तरों पर था। मैंने कई एसिंक्स पैटर्न सीखे, वादे (जो वास्तव में आशाजनक हैं), जनरेटर (निश्चित नहीं कि * प्रतीक) क्यों, आदि इनमें से वादे, मेरे उद्देश्य के अनुकूल हैं। और मैं उन्हें अपने अनुप्रयोगों में काफी उपयोग कर रहा हूं।

यहाँ एक उदाहरण / pseudocode है कि मैंने एक मूल वादा कैसे लागू किया है-

var myPromise = new Promise(
    function (resolve,reject) {
      var x = MyDataStore(myObj);
      resolve(x);
    });

myPromise.then(
  function (x) {
    init(x);
});

जैसे-जैसे समय बीतता गया, मैं ECMAScript 7 सुविधाओं में आया, और उनमें से एक ASYNCऔर AWAITकीवर्ड / फ़ंक्शंस। ये संयोजन महान चमत्कार करते हैं। मैंने अपने कुछ वादों को बदलना शुरू कर दिया है async & await। वे प्रोग्रामिंग शैली में बहुत अधिक मूल्य जोड़ते हैं।

फिर, यहाँ कैसे मेरे async, प्रतीक्षा समारोह की तरह एक छद्म है-

async function myAsyncFunction (myObj) {
    var x = new MyDataStore(myObj);
    return await x.init();
}
var returnVal = await myAsyncFunction(obj);

वाक्यविन्यास त्रुटियों (यदि कोई हो) को एक तरफ रखते हुए, वे दोनों वही करते हैं जो मुझे लगता है। मैं अपने अधिकांश वादों को async, प्रतीक्षा के साथ बदलने में सक्षम रहा हूँ।

जब कोई समान काम करता है तो async, प्रतीक्षा की आवश्यकता क्यों होती है?

क्या async, एक बड़ी समस्या का समाधान इंतजार कर रहा है? या यह नरक कॉल करने के लिए सिर्फ एक अलग समाधान था?

जैसा कि मैंने पहले कहा था, मैं वादों और async का उपयोग करने में सक्षम हूं, उसी समस्या को हल करने के लिए इंतजार कर रहा हूं। क्या ऐसा कुछ विशिष्ट है जो async प्रतीक्षा का हल है?

अतिरिक्त नोट्स:

मैं अपनी प्रतिक्रिया परियोजनाओं और Node.js मॉड्यूल में बड़े पैमाने पर एसिंक्रेट, वेट और वादों का उपयोग कर रहा हूं। रिएक्ट विशेष रूप से एक प्रारंभिक पक्षी रहा है और उसने बहुत सारी ईसीएमएस्क्रिप्ट 6 और ईसीएमएस्क्रिप्ट 7 विशेषताओं को अपनाया है।


3
आपका पहला कोड ब्लॉक एक तुल्यकालिक ऑपरेशन के लिए एक वादा का उपयोग करने के लिए प्रकट होता है। तुम ऐसा क्यों करोगे? सिंक्रोनस, स्वभाव से, कोड लिखना आसान है, इसलिए एक तुल्यकालिक ऑपरेशन को एक वादा में लपेटने के लिए बहुत कम कारण होना चाहिए और इसे अब async होने के लिए मजबूर करना चाहिए।
jfriend00

@ jfriend00 हाँ आप सही हैं। कोड को संपादित किया। धन्यवाद।
बूज्मोब

2
आपका अभी भी सिंक्रोनस फ़ंक्शंस के साथ async टूल का उपयोग करने की कोशिश कर रहा है - अब दोनों कोड ब्लॉक में। क्यों?
jfriend00

@ jfriend00 ठीक है। यहाँ पर मेरा कोड gist.github.com/bozzmob/26d38b83dc37d1be37f5 है । कृपया आप मुझे बताएं कि मैं क्या गलत कर रहा हूं?
बूझमोब

10
ऐसा लगता है कि आपको यह समझने के लिए कि क्या async और इंतजार कर रहे हैं पढ़ने के लिए सिर्फ एक गुच्छा करने की आवश्यकता है। यहाँ कुछ लेख दिए गए हैं: जावास्क्रिप्ट में Async / Await की लंबी सड़क और ES7 Async Functions के साथ Asynchronous Coding और ES7 के साथ Asynchronous Beast का Taming
jfriend00

जवाबों:


74

जब वादा करता है, इसी तरह का काम करता है तो async क्यों जरूरी है? क्या async, एक बड़ी समस्या का समाधान इंतजार कर रहा है?

async/awaitबस आपको अतुल्यकालिक कोड के लिए एक तुल्यकालिक अनुभव देता है। यह वाक्यात्मक चीनी का एक बहुत ही सुंदर रूप है।

सरल प्रश्नों और डेटा हेरफेर के लिए, वादे सरल हो सकते हैं, लेकिन यदि आप उन परिदृश्यों में भाग लेते हैं जहां जटिल डेटा हेरफेर है और क्या शामिल नहीं है, तो यह समझना आसान है कि क्या हो रहा है यदि कोड बस ऐसा लगता है जैसे कि यह तुल्यकालिक है (इसे दूसरे तरीके से डालने के लिए, स्वयं का वाक्यविन्यास "आकस्मिक जटिलता" का एक रूप है जो async/awaitचारों ओर हो सकता है)।

यदि आप जानना चाहते हैं, तो आप एक पुस्तकालय का उपयोग कर सकते हैं co( जैसे जनरेटर के साथ) एक ही तरह का अनुभव देने के लिए। इस तरह की चीजों को समस्या को हल करने के लिए विकसित किया गया है जो async/awaitअंततः (मूल रूप से) हल करती है।


क्या आप विस्तृत कर सकते हैं कि "आकस्मिक जटिलता" का क्या अर्थ है? इसके अलावा, जब प्रदर्शन की बात आती है, तो दोनों में कोई अंतर नहीं है?
बूझमोब

@bozzmob, shaffner.us/cs/papers/tarpit.pdf <- वह वहां "आकस्मिक जटिलता" की व्याख्या करता है। जहां तक ​​आपके प्रदर्शन का सवाल है, मुझे इसमें संदेह है, खासकर वी 8 इंजन के होने के कारण। मुझे यकीन है कि वहाँ कुछ पूर्ण परीक्षण हैं, लेकिन मैं इसके बारे में बहुत ज्यादा चिंता नहीं करूंगा। जब आवश्यक न हो तो माइक्रो-ऑप्टिमाइज़ेशन पर अपना समय बर्बाद न करें।
जोश बीम

1
आपका बहुत बहुत धन्यवाद! यह कुछ महान जानकारी है जो मुझे आपसे मिली है। और हाँ, माइक्रो ऑप्टिमाइज़ेशन पर ध्यान नहीं देंगे।
बूज्मोब

मुझे यह स्पष्टीकरण सहायक nikgrozev.com/2015/07/14/…
mwojtera

33

Async / Await अधिक जटिल परिदृश्यों में एक बहुत अच्छे वाक्यविन्यास प्रदान करता है। विशेष रूप से, छोरों या कुछ अन्य निर्माणों जैसे try/ से निपटने वाली कोई भी चीज़ catch

उदाहरण के लिए:

while (!value) {
  const intermediate = await operation1();
  value = await operation2(intermediate);
}

यह उदाहरण केवल वादों के उपयोग से काफी अधिक जटिल होगा।


इसे समझने के लिए यह एक बेहतरीन उदाहरण है। तो, जब प्रदर्शन की बात आती है, तो दोनों के बीच कोई अंतर नहीं है? और जो कोड में उपयोग करने के लिए बेहतर है? आपके उदाहरण को कम से कम देखने के बाद Async Await बेहतर लगता है।
बूझमोब

1
@bozzmob: प्रदर्शन में कोई अंतर नहीं है। यदि आप async / प्रतीक्षा का उपयोग करके सहज हैं, तो मैं इसकी सिफारिश करूंगा। मैं इसका उपयोग स्वयं नहीं करता, क्योंकि यह वास्तव में आधिकारिक मानक का हिस्सा नहीं है।
स्टीफन क्ली

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

1
मुझे लगता है कि बहुत से लोग भ्रमित होते हैं और / या गुमराह करते हैं जब कोई भी अपने कोड नमूनों में कोशिश / कैच ब्लॉक का उपयोग नहीं करता है।
ऑगी गार्डनर

तुम्हारा मतलब है? const getValue = value => value || operation1().then(operation2).then(getValue);
शार्क्स एक्सएक्स

13

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

पहली चीज़ जो आपको समझनी है कि async/ awaitवाक्यविन्यास सिर्फ वाक्य रचना चीनी है जो वादों को बढ़ाने के लिए है। वास्तव में एक asyncफ़ंक्शन का रिटर्न मूल्य एक वादा है। async/ awaitवाक्यविन्यास हमें तुल्यकालिक तरीके से एसिंक्रोनस लिखने की संभावना देता है। यहाँ एक उदाहरण है:

वादा जंजीर:

function logFetch(url) {
  return fetch(url)
    .then(response => response.text())
    .then(text => {
      console.log(text);
    }).catch(err => {
      console.error('fetch failed', err);
    });
}

Async समारोह:

async function logFetch(url) {
  try {
    const response = await fetch(url);
    console.log(await response.text());
  }
  catch (err) {
    console.log('fetch failed', err);
  }
}

उपरोक्त उदाहरण में awaitवादे का इंतजार ( fetch(url)) या तो हल किया जाए या अस्वीकार किया जाए। यदि वादा हल हो जाता है, तो मूल्य को responseचर में संग्रहीत किया जाता है, और यदि वादा खारिज कर दिया जाता है तो यह एक त्रुटि फेंक देगा और इस प्रकार catchब्लॉक में प्रवेश करेगा ।

हम पहले से ही देख सकते हैं कि का उपयोग करते हुए async/ awaitवादा श्रृंखलन की तुलना में अधिक पठनीय हो सकता है। यह विशेष रूप से सच है जब हम वादों की मात्रा बढ़ा रहे हैं। प्रॉमिस चैनिंग और async/ awaitकॉलबैक नर्क की समस्या को हल करना और आपके द्वारा चुनी गई कौन सी विधि व्यक्तिगत पसंद की बात है।


7

पेशेवरों और विपक्ष के साथ पूर्ण तुलना।

सादा जावास्क्रिप्ट

  • पेशेवरों
  • किसी भी अतिरिक्त पुस्तकालयों या प्रौद्योगिकी की आवश्यकता नहीं है
  • ओ the सबसे अच्छा प्रदर्शन करता है
  • तीसरे पक्ष के पुस्तकालयों के साथ संगतता का सर्वोत्तम स्तर प्रदान करता है
  • विज्ञापन तदर्थ और अधिक उन्नत एल्गोरिदम के निर्माण की अनुमति देता है
  • विपक्ष
  • अतिरिक्त कोड और अपेक्षाकृत जटिल एल्गोरिदम की आवश्यकता हो सकती है

Async (लाइब्रेरी)

  • पेशेवरों
  • सिम्पी। सबसे सामान्य नियंत्रण fi उल्लू पैटर्न है
  • अभी भी एक कॉलबैक आधारित समाधान है
  • अच्छा प्रदर्शन
  • विपक्ष
  • एक बाहरी निर्भरता का परिचय देता है
  • अभी भी उन्नत। गायों के लिए पर्याप्त नहीं हो सकता है

वादे

  • पेशेवरों
  • बहुत सरल है the सबसे सामान्य नियंत्रण fi उल्लू पैटर्न
  • मजबूत त्रुटि से निपटने
  • ईएस २०१५ के विशिष्ट भाग the कटियन
  • गारंटीकृत आफ्टरफिल और ऑनराइक के आह्वान को स्थगित करता है
  • विपक्ष
  • कॉलबैक-आधारित एपीआई को बढ़ावा देने की आवश्यकता है
  • एक छोटे से प्रदर्शन हिट का परिचय देता है

जेनरेटर

  • पेशेवरों
  • नॉन-ब्लॉकिंग एपीआई एक ब्लॉकिंग की तरह दिखता है
  • सिंपली fi es एरर हैंडलिंग
  • ईएस २०१५ का एक हिस्सा of कटियन
  • विपक्ष
  • एक पूरक नियंत्रण की आवश्यकता है library उल्लू पुस्तकालय
  • अभी भी गैर-अनुक्रमिक। गायों को लागू करने के लिए कॉलबैक या वादों की आवश्यकता होती है
  • Nongenerator- आधारित API को thunkify या प्रॉमिस करना होगा

असिंच का इंतजार

  • पेशेवरों
  • नॉन-ब्लॉकिंग एपीआई दिखने में ब्लॉकिंग जैसा लगता है
  • स्वच्छ और सहज वाक्य रचना
  • विपक्ष
  • आज उपयोग किए जाने वाले बैबेल या अन्य ट्रांसपॉयलर और कुछ con be अवधि की आवश्यकता है

यह कहाँ से कॉपी किया गया था? कम से कम इसका कुछ पृष्ठ Node.js डिज़ाइन पैटर्न (दूसरा संस्करण) (ISBN-10: 1785885588) पुस्तक में पृष्ठ 136-137 पर है
पीटर मोर्टेंसन

6

Async / wait आपके कोड क्लीनर और उन मामलों में अधिक पठनीय बनाने में मदद कर सकता है जहाँ आपको जटिल नियंत्रण प्रवाह की आवश्यकता होती है। यह अधिक डिबग-फ्रेंडली कोड भी तैयार करता है। और समकालिक और अतुल्यकालिक दोनों त्रुटियों को संभालना संभव बनाता है try/catch

मैंने हाल ही में इस पोस्ट को कोड के उदाहरणों के साथ कुछ सामान्य उपयोग के मामलों में वादों का इंतजार करते हुए async / फायदे का इंतजार करते हुए लिखा है: 6 कारण क्यों जावास्क्रिप्ट Async / Await Blows Promises Away (ट्यूटोरियल)

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.