कार्यक्रम - 1
new Promise(resolve => {
resolve('1');
Promise.resolve().then(() => console.log('2'));
}).then(data => {
console.log(data);
}); // output 2 1
कार्यक्रम -2
new Promise(resolve => {
Promise.resolve().then(() => {
resolve('1');
Promise.resolve().then(() => console.log('2'));
});
}).then(data => {
console.log(data);
}); // output 1 2
मैं वास्तव में दोनों कार्यक्रमों के आउटपुट से भ्रमित हूं। क्या कोई मुझे बता सकता है कि निष्पादन धागा यहां कैसे काम करता है?
2 जवाब
यह समझना कठिन है कि resolve return की तरह काम नहीं करता। Promises बनाना वास्तव में एक नया async संदर्भ बनाता है। Promise के पहले फ़ंक्शन के अंदर सब कुछ समकालिक रूप से निष्पादित किया जाता है। फिर .then() विधियों को समकालिक या अतुल्यकालिक रूप से हल किए गए मानों के साथ बुलाया जाता है।
पहले उदाहरण में, आप '1' को हल करते हैं, लेकिन फिर आप Promise.resolve() के साथ एक नया Promise बनाते हैं और आप तुरंत .then() को कॉल करते हैं। चूंकि नया Promise पहले वाले के अंदर है, इसलिए सब कुछ सिंक्रोनस रूप से कहा जाता है।
new Promise(resolve => {
resolve('1'); // Will be accessed in the .then() after then end of the callback
Promise.resolve().then(() => log('2')); // called before the end of the function
// because the context is not yet created
}).then(data => {
log(data);
}); // output 2 1
दूसरा उदाहरण बहुत कठिन है। आप वास्तव में पहले Promise के अंदर एक Promise बनाते हैं और तुरंत resolve को कॉल करते हैं। निष्पादन का क्रम होगा:
- प्रारंभिक कॉलबैक में सबसे पहले सब कुछ
- उसके बाद,
resolveसे.thenकी तरहeventListenersबनाएं - जब एक
resolveको कॉल किया जाता है, तो.thenमें कॉलबैक निष्पादित करें
नेस्टेड promise के प्रारंभिक कार्य में कुछ भी नहीं है। तो यह सीधे then पर जाता है। .then() प्रारंभिक resolve() को कॉल करता है। यहां, eventListener का प्रकार बनाया गया है, इसलिए हम प्रारंभिक कॉलबैक पर जाते हैं। फिर हम वापस जाते हैं और बाकी फ़ंक्शन को निष्पादित करते हैं।
new Promise(resolve => {
// Because we call resolve right away, the context of the original promise
// is created
Promise.resolve().then(() => {
resolve('1'); // Calling resolve jumps us to the .then
Promise.resolve().then(() => log('2')); // We execute after.then
});
}).then(data => {
log(data);
}); // output 1 2
अगर आपने .resolve() को हटा दिया है, तो यह पहले वाले की तरह काम करेगा:
new Promise(resolve => {
new Promise(() => {
resolve('1');
Promise.resolve().then(() => log('2'));
});
}).then(data => {
log(data);
}); // output 2 1
log('2') अतुल्यकालिक भी है।
resolve('1') के पास अभी तक कोई श्रोता नहीं है, इसलिए ईवेंट लूप में कोई संबद्ध ईवेंट नहीं है। Promise.resolve().then(() => log('2')); लूप में किसी ईवेंट को तुरंत पुश और उपभोग करता है। पहले फ़ंक्शन का दायरा छोड़ते समय, आप श्रोता बनाते हैं और तुरंत resolve में मान के साथ इसका उपभोग करते हैं
new Promise निष्पादक के छोड़े जाने से पहले इसे निष्पादित नहीं करता है।
अंतर इस संदर्भ में है कि वादा को हल करते समय इवेंट लूप होता है (resolve(1))।
JS में कोड निष्पादित करने वाली 2 कतारें हैं:
- माइक्रोटास्क क्यू
- मैक्रोटास्क क्यू
जेएस एक माइक्रोटास्क निष्पादित करता है और फिर मैक्रोटास्क क्यू (यदि कोई हो) से सभी कार्यों को चलाता है
executor (वादा(...)) से एक वादे को हल करते समय आप मैक्रोटास्क Q के अंदर चल रहे हैं। एक वादा कॉलबैक के अंदर से निष्पादित कोड माइक्रोटास्क< पर निष्पादित किया जाता है /मजबूत> क्यू.
इस मामले में जो अंतर मायने रखता है वह यह है कि माइक्रोटास्क क्यू के अंदर से चलते समय यदि आप अन्य माइक्रोटास्क जोड़ते हैं (वादा कॉलबैक माइक्रोटास्क होते हैं) तो वे वर्तमान क्यू में जुड़ जाते हैं और इस क्यू रन के दौरान संसाधित हो जाते हैं।
यही होता है अगर नंबर 2 में, आप एक माइक्रोटास्क क्यू के अंदर से वादे को हल कर रहे हैं, यह शीर्ष स्तर Promise को हल करता है और .then(data => { log(data); }); को वर्तमान माइक्रोटास्क क्यू। तो इस रन में कॉलबैक निष्पादित हो जाएगा। दूसरी ओर, नेस्टेड प्रॉमिस Promise.resolve() के हैंडलर्स को अभी निष्पादित नहीं किया जाता है, क्योंकि हैंडलर्स को हमेशा async कहा जाता है।
नोट: निष्पादन को अवरुद्ध करते हुए, माइक्रोटास्क क्यू के अंदर से माइक्रोटास्क एड इनफिनिटम जोड़ना संभव है।
I am really confused with the output of both the programs.और क्यों? आपको किस आउटपुट की उम्मीद थी और क्यों?.then(func)में फ़ंक्शनPromiseके हल होने के बाद निष्पादित होता है, इसे हल तर्क पास करता है।