जावास्क्रिप्ट में प्रॉमिस क्लास

इस लेख में, हम जावास्क्रिप्ट में प्रॉमिस क्लास की व्याख्या करेंगे।

YouTube Video

Promise

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

1const promise = new Promise((resolve, reject) => {
2    setTimeout(() => resolve("Done!"), 1000);
3});
4
5// Displays "Done!" after 1 second
6promise.then(result => console.log(result));

• यह कोड एक असिंक्रोनस प्रक्रिया का उदाहरण है जो एक सेकंड के बाद "Done!" दिखाता है।
  • सबसे पहले, new Promise का उपयोग करके एक नया Promise ऑब्जेक्ट बनाया जाता है। आर्ग्युमेंट एक फ़ंक्शन है जो दो कॉलबैक लेता है: सफलता के लिए resolve और असफलता के लिए reject।
  • setTimeout का उपयोग एक सेकंड के बाद resolve() को कॉल करने के लिए किया जाता है।
  • promise ऑब्जेक्ट की then() मेथड पूर्णता का इंतजार करती है और परिणाम दिखाती है।

मूल संरचना

Promise एक ऑब्जेक्ट है जिसका परिणाम अंततः या तो सफलता या असफलता हो सकता है।

 1const promise = new Promise((resolve, reject) => {
 2    // Asynchronous operation
 3    // Flag indicating whether the operation was successful
 4    const success = true;
 5
 6    if (success) {
 7        resolve('Operation successful!');
 8    } else {
 9        reject('An error occurred');
10    }
11});

• सफलता के मामले में, resolve() को कॉल किया जाता है।
• असफलता के मामले में, reject() को कॉल किया जाता है।

Promise ऑब्जेक्ट के तीन अवस्था होते हैं।

1promise
2    .then((result) => {
3        console.log(result);
4    })
5    .catch((error) => {
6        console.error(error);
7    })

• Pending
  • असिंक्रोनस प्रक्रिया अभी पूरी नहीं हुई है।
• Fulfilled
  • असिंक्रोनस प्रक्रिया सफल हुई, और परिणाम resolve() द्वारा लौटाया गया। परिणाम then() मेथड का उपयोग करके प्राप्त होता है।
• Rejected
  • असिंक्रोनस प्रक्रिया विफल हो गई, और एक त्रुटि reject() के द्वारा आई। त्रुटि catch() मेथड के द्वारा प्राप्त होती है।

then() और catch() मेथड्स

Promise का उपयोग करके, आप निर्धारित कर सकते हैं कि असिंक्रोनस ऑपरेशन समाप्त होने पर क्या करना है। इसके लिए, आप then() और catch() मेथड्स का उपयोग करते हैं।

then()

1const promise = new Promise((resolve, reject) => {
2    resolve('Operation successful!');
3});
4
5promise.then((result) => {
6    console.log(result);  // "Operation successful!"
7});

• then() मेथड एक फंक्शन निर्दिष्ट करता है जिसे Promise के सफल होने पर कॉल किया जाएगा।

catch()

1const promise = new Promise((resolve, reject) => {
2    reject('An error occurred');
3});
4
5promise.catch((error) => {
6    console.error(error);  // "An error occurred"
7});

• catch() मेथड एक फंक्शन निर्दिष्ट करता है जिसे Promise के विफल होने पर कॉल किया जाएगा।

finally() मेथड

 1const promise = new Promise((resolve, reject) => {
 2    resolve('Operation successful!');
 3});
 4
 5promise
 6    .then((result) => {
 7        console.log(result);
 8    })
 9    .catch((error) => {
10        console.error(error);
11    })
12    .finally(() => {
13        console.log('The operation has completed');
14    });

• finally() मेथड कोड को निर्दिष्ट करता है जिसे अंत में चलाया जाएगा, चाहे Promise सफल हुआ हो या असफल।

then() चेन

then() एक नया Promise वापस करता है, इसलिए आप अगले then() को चेन कर सकते हैं।

 1const promise = new Promise((resolve, reject) => {
 2    setTimeout(() => {
 3        resolve(1);
 4    }, 1000);
 5});
 6
 7promise
 8    .then(result => {
 9        console.log(result); // 1
10        return result + 1;
11    })
12    .then(result => {
13        console.log(result); // 2
14        return result + 1;
15    })
16    .then(result => {
17        console.log(result); // 3
18    })
19    .catch(error => {
20        console.error(error.message); // Something went wrong
21    });

• इस कोड में, प्रारंभिक resolve() मान 1 पास करता है, और प्रत्येक then द्वारा लौटाया गया मान अगले then को पास किया जाता है।
• catch() का उपयोग करके, आप चेन में किसी भी त्रुटि को एक ही स्थान पर संभाल सकते हैं।

व्यावहारिक उदाहरण

उदाहरण के लिए, Promises का अक्सर सर्वर से डेटा प्राप्त करने के लिए उपयोग किया जाता है। आइए fetch() API का उपयोग करके एक उदाहरण देखें।

 1fetch('https://codesparklab.com/json/example.json')
 2    .then(response => {
 3        if (!response.ok) {
 4            throw new Error('Network error');
 5        }
 6        return response.json();
 7    })
 8    .then(data => {
 9        console.log(data);
10    })
11    .catch(error => {
12        console.error('Error:', error);
13    });

• इस कोड में, चूंकि fetch() एक Promise लौटाता है, इसलिए सर्वर से प्रतिक्रिया प्राप्त करने के बाद डेटा को प्रोसेस करने के लिए then() का उपयोग किया जाता है। त्रुटियों को संभालने के लिए catch() का उपयोग किया जाता है।

कई Promises को संभालना

Promise.all()

कई Promises को एक साथ निष्पादित करने और तभी आगे बढ़ने के लिए जब सभी सफल हों, Promise.all() का उपयोग करें।

 1const promise1 = Promise.resolve(1);
 2const promise2 = Promise.resolve(2);
 3const promise3 = Promise.resolve(3);
 4
 5Promise.all([promise1, promise2, promise3])
 6    .then((results) => {
 7        console.log(results);  // [1, 2, 3]
 8    })
 9    .catch((error) => {
10        console.error('Error :', error);
11    });

• केवल तभी then() को कॉल किया जाता है जब सभी Promises सफल हो। अगर एक भी विफल हो, तो catch() को कॉल किया जाता है।

Promise.allSettled()

यदि आप एक साथ कई Promise चलाना चाहते हैं और सफलता या विफलता की परवाह किए बिना सभी परिणाम प्राप्त करना चाहते हैं, तो Promise.allSettled() का उपयोग करें।

 1const promise1 = Promise.resolve(1);
 2const promise2 = Promise.reject("Failed");
 3const promise3 = Promise.resolve(3);
 4
 5Promise.allSettled([promise1, promise2, promise3])
 6    .then((results) => {
 7        results.forEach(result => console.log(result));
 8        // [
 9        //   { status: 'fulfilled', value: 1 },
10        //   { status: 'rejected', reason: 'Failed' },
11        //   { status: 'fulfilled', value: 3 }
12        // ]
13    });

• सभी Promise के सेट होने (या तो पूर्ण या अस्वीकार किए जाने) के बाद then() कॉल किया जाता है। प्रत्येक परिणाम में एक status प्रॉपर्टी होती है ('fulfilled' या 'rejected')। यदि कुछ विफल भी हो जाएं, तो भी इसका अन्य कार्यों पर कोई प्रभाव नहीं पड़ता।

Promise.race()

Promise.race() उस Promise का परिणाम लौटाता है जो पहले पूरा हो जाता है, चाहे वह सफल हो या असफल।

1const promise1 = new Promise((resolve) => setTimeout(resolve, 100, 'First'));
2const promise2 = new Promise((resolve) => setTimeout(resolve, 500, 'Second'));
3
4Promise.race([promise1, promise2]).then((result) => {
5    console.log(result);  // "First"
6});

• जैसा कि इस उदाहरण में है, पहले पूर्ण हुए Promise का परिणाम वापस किया जाता है।

async/await के साथ संबंध

async/await सिंटैक्स का उपयोग करने से Promises को अधिक सहजता से लिखा जा सकता है। एक async फ़ंक्शन हमेशा एक Promise लौटाता है, और await Promise के हल होने का इंतजार करता है।

 1async function fetchData() {
 2    try {
 3        const response = await fetch('https://codesparklab.com/json/example.json');
 4        const data = await response.json();
 5        console.log(data);
 6    } catch (error) {
 7        console.error('Error :', error);
 8    }
 9}
10
11fetchData();

इस तरह async/await का उपयोग करके, असिंक्रोनस संचालन को सिंक्रोनस कोड की तरह लिखा जा सकता है, जिससे इसे पढ़ना आसान हो जाता है।

सारांश

• Promise असिंक्रोनस संचालन की सफलता या विफलता को संभालने के लिए एक ऑब्जेक्ट है।
• सफल संचालन को then() से और त्रुटियों को catch() से संभालें।
• finally() उस कोड को परिभाषित करता है जो अंत में निष्पादित होता है, चाहे सफलता हो या विफलता।
• आप Promise.all() या Promise.race() का उपयोग करके कई Promises को एक साथ संभाल सकते हैं।
• async/await Promises को अधिक सरलता से लिखने का सिंटैक्स है।

आप हमारे YouTube चैनल पर Visual Studio Code का उपयोग करके ऊपर दिए गए लेख के साथ आगे बढ़ सकते हैं। कृपया YouTube चैनल को भी देखें।

YouTube Video