प्रॉमिस का दृश्य निरूपण

अवरोध तोड़कर आगे...

Promises के निष्पादन क्रम को समझने के लिए, हम एक सहायक विधि delay(millisecs) परिभाषित करेंगे।

function delay(millisecs) {
  return new Promise(resolve => {
    setTimeout(() => resolve(millisecs), millisecs);
  });
}

यह एक utility विधि है जो टाइमआउट पूरा होने पर Promise को resolve करेगी।

मिलीसेकंड में बताई गई विलंबता .then के callback में पास की जाएगी।

आइए 4 उदाहरणों पर नज़र डालें (एनिमेटेड टाइमलाइन्स के साथ)।

उदाहरण #1/4

यह दर्शाता है कि console.log() का निष्पादन delay(msec) कॉल द्वारा कैसे विलंबित होगा।

delay(1000).then(() => console.log("done"));

उदाहरण #2/4

यह एक सामान्य गलती को दर्शाता है।

console.log तुरंत चलता है जब delay(1000) शुरू होता है। विलंब के बाद नहीं, बल्कि जैसा कि आप शायद चाहते थे।

चूंकि console.log undefined लौटाता है, हमारा .then() चुपचाप अनदेखा कर दिया जाता है।

typeof console.log === 'function' बनाम typeof console.log() === undefined के अंतर को नोट करें।

सामान्यतः console.log का वांछित उपयोग उदाहरण #1 में दिखाया गया है। .then और .catch में फ़ंक्शन पास करना सुनिश्चित करें।

delay(1000).then(console.log("done"));

उदाहरण #3/4

3 Promises एक साथ निष्पादित होते हैं।

delay(1000).then(console.log);
delay(2000).then(console.log);
delay(3000).then(console.log);

उदाहरण #4/4

Promise.all में 3 delay Promise हैं। ये समानांतर रूप से निष्पादित होंगे।

Promise.all([delay(1000), delay(2000), delay(3000)]).then(console.log);

क्रेडिट:

• एनिमेटेड async आरेख: Patrick Biffle
• इस लेख के लिए प्रेरणा: https://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html