DEV Community

Cover image for Promise In Javascript
Harendra Kumar Kanojiya
Harendra Kumar Kanojiya

Posted on

Promise In Javascript

यह मेरा पहला लेख है हिंदी में, बस कुछ नया आजमाने की कोशिश कर रहा हूँ। आशा है कि आपको यह पसंद आएगा।

क्या आपने javascript में 'promises' के बारे में सीखा है? यह एक विषय है जिस पर बहुत से लोग तुरंत ही हाथ उठा देते हैं, लेकिन मैं आपके लिए इसे जितना सरल बनाने का प्रयास करूँगा, जितना हो सके।

1. Promise का मतलब क्या है?

"Promise" एक asynchronous प्रोग्रामिंग में मौलिक अवधारणा है, खासकर javascript और कई आधुनिक प्रोग्रामिंग भाषाओं में। इसका मतलब है कि यह एक मूल्य को प्रतिनिधित करता है (या किसी कार्य के अंतर्गत परिणाम को) जो शायद अब तक उपलब्ध नहीं है, लेकिन भविष्य में किसी समय विफलता के साथ (त्रुटि के साथ) या सफलता के साथ निर्धारित होगा।

2. Promise की स्थितियाँ:

Javascript में, एक Promise तीन स्थितियों में से एक में हो सकता है:

  1. Pending (लंबित): यह वो प्रारंभिक स्थिति है जब एक Promise बनाई जाती है। इसका मतलब है कि Promise द्वारा प्रतिनिधित asynchronous कार्य अब तक पूरा नहीं हुआ है, और परिणाम (पूर्ण या असफल) उपलब्ध नहीं है। Promises इस स्थिति में शुरू होती हैं और फिर दूसरी स्थितियों में से किसी में जाती हैं।

  2. Fulfilled (पूर्ण): यह स्थिति असिंक्रोनस कार्य की सफल पूर्णता को प्रतिनिधित करती है। जब एक Promise पूर्ण स्थिति में चली जाती है, तो इसका मतलब है कि कार्य सफलतापूर्वक समाप्त हो गया है, और परिणाम (एक मूल्य या डेटा) उपलब्ध है। आप .then() मेथड का उपयोग करके पूर्ण मूल्य को पहुँच सकते हैं।

  3. Rejected (असफल): यह स्थिति असिंक्रोनस कार्य की असफलता को प्रतिनिधित करती है। जब एक Promise असफल स्थिति में चली जाती है, तो इसका मतलब है कि कार्य के दौरान कोई त्रुटि या अपवाद हुआ है। आप असफलता के कारण (एक त्रुटि ऑब्जेक्ट या संदेश) को पहुँच सकते हैं और इसे .catch() मेथड या .then() मेथड के दूसरे आर्ग्यमेंट का उपयोग करके हैंडल कर सकते हैं।

यहां एक Promise की स्थितियों और स्थितियों के बदलावों का एक दृश्यात्मक प्रतिष्ठान है:

Initial State:      Pending
                   /       \
Fulfilled State:  Fulfilled  Rejected
(result available) (error occurred)
Enter fullscreen mode Exit fullscreen mode

"Promises" का डिज़ाइन इसे असिंक्रोनस कार्यों के साथ काम करने के एक संरचित तरीके प्रदान करने के लिए है, जिससे आप सफलता और असफलता के मामलों को अलग-अलग हैंडल कर सकते हैं। आप .then() का उपयोग करके स्पष्ट कर सकते हैं कि प्रॉमिस पूर्ण होने पर क्या करना है और .catch() का उपयोग करके त्रुटियों का संबोधन कर सकते हैं जब प्रॉमिस असफल होता है। इससे तुलनात्मक प्रोक्षिप्त आधारित दृष्टिकोणों के मुकाबले असिंक्रोनस कोड को प्रबंधनीय और पढ़ने में आसानी हो जाती है।

3. प्रॉमिस कैसे बनाते हैं

Javascript में एक प्रॉमिस बनाने के लिए, आप Promise कंस्ट्रक्टर का उपयोग कर सकते हैं, जो एक एकल फ़ंक्शन को एक विधि के रूप में लेता है। इस फ़ंक्शन को कार्यकर्ता फ़ंक्शन कहा जाता है, और इसमें दो पैरामीटर होते हैं: resolve और rejectresolve फ़ंक्शन का उपयोग प्रॉमिस को एक मूल्य से पूर्ण करने के लिए किया जाता है, और reject फ़ंक्शन का उपयोग एक त्रुटि के साथ प्रॉमिस को अस्वीकृत करने के लिए किया जाता है।

यहां एक प्रॉमिस बनाने की मूल संरचना है:

const myPromise = new Promise((resolve, reject) => {
  // Asynchronous or time-consuming operation goes here
  // Typically, you would perform some async task, like fetching data or reading a file

  // If the operation is successful, call resolve with the result
  // resolve(result);

  // If an error occurs, call reject with an error object or message
  // reject(error);
});
Enter fullscreen mode Exit fullscreen mode

यहां एक और स्पष्ट उदाहरण है जो setTimeout का उपयोग करके देरी से असिंक्रोनस कार्य को सिम्युलेट करता है और कुछ समय बाद प्रॉमिस को पूर्ण करता है:

const delay = (milliseconds) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`Resolved after ${milliseconds} milliseconds`);
    }, milliseconds);
  });
};

// Usage:
delay(2000) // Wait for 2 seconds
  .then((result) => {
    console.log(result); // Resolved after 2000 milliseconds
  })
  .catch((error) => {
    console.error(error);
  });
Enter fullscreen mode Exit fullscreen mode

इस उदाहरण में:

  1. हम एक फ़ंक्शन delay की परिभाषा करते हैं जो एक प्रॉमिस लौटाता है। प्रॉमिस कंस्ट्रक्टर के अंदर, हम setTimeout का उपयोग एक असिंक्रोनस देरी को सिम्युलेट करने के लिए करते हैं।

  2. अगर असिंक्रोनस कार्य सफल होता है (यानी, setTimeout पूरा हो जाता है), तो हम परिणाम के साथ resolve को कॉल करते हैं।

  3. कार्य के दौरान कोई त्रुटि होती है, तो हम किसी त्रुटि ऑब्जेक्ट या संदेश के साथ reject को कॉल कर सकते हैं।

  4. हम .then() का उपयोग करते हैं ताकि निश्चित कर सकें कि प्रॉमिस पूर्ण होते समय क्या करना है (पूर्ण किया गया है), और हम .catch() का उपयोग करते हैं ताकि कोई भी त्रुटियां जो हो सकती हैं, उन्हें हैंडल कर सकें।

यह एक सरल उदाहरण है, लेकिन व्यावासिक रूप में, आप setTimeout को असली असिंक्रोनस कार्यों के साथ बदलेंगे, जैसे कि API अनुरोध करना या एक फ़ाइल को पढ़ना। प्रॉमिस असिंक्रोनस कोड को हैंडल करने और इसे और पठनीय और रखने योग्य बनाने के लिए एक संरचित तरीका प्रदान करते हैं।

3.1 प्रॉमिस पूर्ण होते समय मूल्य लौटाना

जावास्क्रिप्ट प्रॉमिस में, आप प्रॉमिस पूर्ण होते समय मूल्य लौटा सकते हैं, प्रॉमिस के कार्यकर्ता फ़ंक्शन के भीतर resolve फ़ंक्शन को प्रॉमिस के निर्वाचन के रूप में स्वीकृत मूल्य के रूप में एक आर्ग्यमेंट के रूप में प्रदान करके। यहां दिखाया गया है कि आप ऐसा कैसे कर सकते हैं:

function createPromiseWithValue() {
  return new Promise((resolve, reject) => {
    const valueToReturn = "This is the resolved value.";
    resolve(valueToReturn);
  });
}

createPromiseWithValue()
  .then((result) => {
    console.log(result); // Output: "This is the resolved value."
  })
  .catch((error) => {
    console.error(error);
  });
Enter fullscreen mode Exit fullscreen mode

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

प्रॉमिस असफल होने पर एक त्रुटि लौटाना

जावास्क्रिप्ट प्रॉमिस में, आप प्रॉमिस असफल होते समय एक त्रुटि संदेश या एक त्रुटि ऑब्जेक्ट को प्रॉमिस के कार्यकर्ता फ़ंक्शन के भीतर reject फ़ंक्शन के एक आर्ग्यमेंट के रूप में प्रदान करके एक त्रुटि लौटा सकते हैं। यहां दिखाया गया है कि आप ऐसा कैसे कर सकते हैं:

function createPromiseWithError() {
  return new Promise((resolve, reject) => {
    const errorMessage = "This is an error message.";
    reject(errorMessage);
  });
}

createPromiseWithError()
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.error(error); // Output: "This is an error message."
  });
Enter fullscreen mode Exit fullscreen mode

इस उदाहरण में, हमने createPromiseWithError नामक फ़ंक्शन का परिभाषित किया है, जो एक प्रॉमिस बनाता है और reject के द्वारा त्रुटि संदेश को असफल किया जाने वाले मूल्य के रूप में प्रदान करता है। जब प्रॉमिस असफल होता है, तो हम .catch() का उपयोग करके त्रुटि संदेश को प्रिंट करते हैं।

पढ़ने के लिए धन्यवाद, मुझे ट्विटर पर फ़ॉलो करें - @harendraverma2

Image of Datadog

How to Diagram Your Cloud Architecture

Cloud architecture diagrams provide critical visibility into the resources in your environment and how they’re connected. In our latest eBook, AWS Solution Architects Jason Mimick and James Wenzel walk through best practices on how to build effective and professional diagrams.

Download the Free eBook

Top comments (0)

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay