"यदि कोई कर्मचारी अपना काम अच्छी तरह से करना चाहता है, तो उसे पहले अपने औजारों को तेज करना होगा।" - कन्फ्यूशियस, "द एनालेक्ट्स ऑफ कन्फ्यूशियस। लू लिंगगोंग"
मुखपृष्ठ > प्रोग्रामिंग > कॉलबैक हेल को समझना: समस्या, समाधान और कोड उदाहरण

कॉलबैक हेल को समझना: समस्या, समाधान और कोड उदाहरण

2024-11-08 को प्रकाशित
ब्राउज़ करें:972

Understanding Callback Hell: The Problem, Solutions and Code Examples

तकनीकी साक्षात्कारों में कॉलबैक नरक भी एक गर्म विषय है, क्योंकि यह एक डेवलपर की एसिंक्रोनस कोड की समझ और बेहतर पठनीयता और रखरखाव के लिए कोड को रिफैक्टर करने की उनकी क्षमता का परीक्षण करता है।

परिचय

आधुनिक जावास्क्रिप्ट विकास में एसिंक्रोनस प्रोग्रामिंग महत्वपूर्ण है, जो गैर-अवरुद्ध निष्पादन को सक्षम बनाता है और प्रदर्शन में सुधार करता है, विशेष रूप से I/O-बाउंड संचालन के लिए। हालाँकि, यह सुविधा कभी-कभी ऐसी स्थिति का कारण बन सकती है जिसे "कॉलबैक हेल" के रूप में जाना जाता है।

इस लेख में, हम इस पर विचार करेंगे:

  1. कॉलबैक हेल क्या है और यह कैसे उत्पन्न होता है।
  2. इसके द्वारा उत्पन्न समस्याएं।
  3. समाधान, जिसमें वादे और async/प्रतीक्षा का उपयोग शामिल है।
  4. सब कुछ स्पष्ट करने के लिए कोड उदाहरण।

कॉलबैक हेल क्या है?

कॉलबैक हेल, जिसे अक्सर "पिरामिड ऑफ डूम" कहा जाता है, तब होता है जब कई नेस्टेड एसिंक्रोनस ऑपरेशन अनुक्रम में निष्पादित करने के लिए एक-दूसरे पर भरोसा करते हैं। यह परिदृश्य गहराई से निहित कॉलबैक की उलझन की ओर ले जाता है, जिससे कोड को पढ़ना, बनाए रखना और डीबग करना कठिन हो जाता है।

कॉलबैक हेल का उदाहरण:

getData(function(data) {
  processData(data, function(processedData) {
    saveData(processedData, function(response) {
      sendNotification(response, function(notificationResult) {
        console.log("All done!");
      });
    });
  });
});

उपरोक्त कोड अनुक्रम में कई अतुल्यकालिक संचालन करता है। हालाँकि यह काम करता है, लेकिन अधिक कार्य जुड़ने पर यह जल्दी से असहनीय हो जाता है, जिससे इसे समझना और बनाए रखना मुश्किल हो जाता है। घोंसला वाली संरचना एक पिरामिड जैसी दिखती है, इसलिए इसे "पिरामिड ऑफ़ डूम" कहा जाता है।

कॉलबैक हेल के साथ समस्या

कॉलबैक नरक कई समस्याओं का कारण बनता है:

  1. बनाए रखना कठिन: गहराई से नेस्टेड कोड को संशोधित/विस्तारित करना कठिन है। आप केवल नई कार्यक्षमता जोड़ने का प्रयास करके बग ला सकते हैं।
  2. त्रुटि प्रबंधन: विभिन्न नेस्टेड परतों में उचित त्रुटि प्रबंधन जटिल हो जाता है। आपको प्रत्येक व्यक्तिगत कॉलबैक के लिए त्रुटियों को संभालना होगा, जिसके कारण बार-बार कोड हो सकता है।
  3. कोड पठनीयता: निष्पादन के प्रवाह को समझना चुनौतीपूर्ण हो जाता है, खासकर कोडबेस से अपरिचित डेवलपर्स के लिए।
  4. स्केलेबिलिटी: जैसे-जैसे नेस्टेड कॉलबैक की संख्या बढ़ती है, वैसे-वैसे जटिलता भी बढ़ती है, जिससे कोड गैर-स्केलेबल हो जाता है और डीबग करना कठिन हो जाता है।

वादे: कॉलबैक नर्क का एक समाधान

कॉलबैक नरक की समस्याओं को कम करने के लिए, वादे का उपयोग जावास्क्रिप्ट में किया जाता है। वादे एक अतुल्यकालिक ऑपरेशन के अंतिम समापन (या विफलता) का प्रतिनिधित्व करते हैं और आपको स्वच्छ, अधिक प्रबंधनीय कोड लिखने की अनुमति देते हैं। वादे कोड को सरल बनाते हैं - वादों के साथ, नेस्टेड संरचना समतल हो जाती है, और त्रुटि प्रबंधन अधिक केंद्रीकृत हो जाता है, जिससे कोड को पढ़ना और बनाए रखना आसान हो जाता है।

यहां बताया गया है कि प्रॉमिस का उपयोग करते हुए पहले का कॉलबैक हेल उदाहरण कैसा दिखेगा:

getData()
 .then(data => processData(data))
 .then(processedData => saveData(processedData))
 .then(response => sendNotification(response))
 .then(notificationResult => {
 console.log("All done!");
 })
 .catch(error => {
 console.error("An error occurred:", error);
 });

यह दृष्टिकोण गहराई से निहित कॉलबैक को समाप्त करता है। प्रत्येक 'तब' ब्लॉक श्रृंखला में अगले चरण का प्रतिनिधित्व करता है, जिससे प्रवाह अधिक रैखिक और अनुसरण करने में आसान हो जाता है। 'कैच' ब्लॉक में त्रुटि प्रबंधन भी केंद्रीकृत है।

वादे कैसे काम करते हैं

वादों की तीन संभावित स्थितियाँ होती हैं:

  1. लंबित: प्रारंभिक स्थिति, जिसका अर्थ है कि वादा अभी तक पूरा नहीं हुआ है या अस्वीकार नहीं किया गया है।
  2. पूरा हुआ: एसिंक्रोनस ऑपरेशन सफलतापूर्वक पूरा हुआ।
  3. अस्वीकृत: ऑपरेशन विफल रहा।

एक प्रॉमिस ऑब्जेक्ट सफलता और विफलता परिदृश्यों को संभालने के लिए '.then()' और '.catch()' तरीके प्रदान करता है।

function getData() {
 return new Promise((resolve, reject) => {
 // Simulating an async operation (e.g., API call)
 setTimeout(() => {
 const data = "Sample Data";
 resolve(data);
 }, 1000);
 });
}
getData()
 .then(data => {
 console.log("Data received:", data);
 })
 .catch(error => {
 console.error("Error fetching data:", error);
 });

उपरोक्त कोड में, 'getData()' फ़ंक्शन एक वादा लौटाता है। यदि एसिंक्रोनस ऑपरेशन सफल हो जाता है, तो वादा डेटा के साथ पूरा हो जाता है, अन्यथा, यह एक त्रुटि के साथ अस्वीकार कर दिया जाता है।

वादों की जंजीर

वादों का एक बड़ा फायदा यह है कि उन्हें जंजीरों में बांधा जा सकता है। यह नेस्टिंग के बिना अतुल्यकालिक संचालन को अनुक्रमित करने की अनुमति देता है।

function fetchData() {
 return new Promise((resolve, reject) => {
 setTimeout(() => resolve("Data fetched"), 1000);
 });
}
function processData(data) {
 return new Promise((resolve, reject) => {
 setTimeout(() => resolve(`${data} and processed`), 1000);
 });
}
function saveData(data) {
 return new Promise((resolve, reject) => {
 setTimeout(() => resolve(`${data} and saved`), 1000);
 });
}
fetchData()
 .then(data => processData(data))
 .then(processedData => saveData(processedData))
 .then(result => {
 console.log(result); 
// Output => Data fetched and processed and saved
 })
 .catch(error => console.error("Error:", error));

वादों को श्रृंखलाबद्ध करने से, कोड सपाट, अधिक पठनीय और बनाए रखने में आसान हो जाता है।

Async/प्रतीक्षा: एक और भी बेहतर विकल्प

हालाँकि कॉलबैक की तुलना में वादे एक महत्वपूर्ण सुधार हैं, फिर भी वे व्यापक श्रृंखलाओं के साथ बोझिल हो सकते हैं। यहीं पर async/await चलन में आता है।
Async/await सिंटैक्स हमें एसिंक्रोनस कोड को सिंक्रोनस कोड के समान लिखने की अनुमति देता है। यह आपके कोड को साफ़-सुथरा और तर्क करने में आसान बनाता है।

Async/प्रतीक्षा का उपयोग करना:

async function performOperations() {
  try {
    const data = await getData();
    const processedData = await processData(data);
    const response = await saveData(processedData);
    const notificationResult = await sendNotification(response);

    console.log("All done!");
  } catch (error) {
    console.error("Error:", error);
  }
}

performOperations();

उपरोक्त कोड में:

  • 'async' कीवर्ड का उपयोग एसिंक्रोनस फ़ंक्शन को परिभाषित करने के लिए किया जाता है।
  • 'प्रतीक्षा' तब तक फ़ंक्शन के निष्पादन को रोक देता है जब तक कि वादा हल नहीं हो जाता या अस्वीकार नहीं हो जाता, जिससे कोड समकालिक दिखने लगता है।
  • एकल 'ट्राई-कैच' ब्लॉक का उपयोग करके त्रुटि प्रबंधन बहुत आसान है।
  • Async/await कॉलबैक नरक और लंबी वादा श्रृंखला को समाप्त करता है, जिससे यह आधुनिक जावास्क्रिप्ट में एसिंक्रोनस संचालन को संभालने का पसंदीदा तरीका बन जाता है।

निष्कर्ष

कॉलबैक हेल जावास्क्रिप्ट में एक आम समस्या है जो कई अतुल्यकालिक संचालन के साथ काम करते समय उत्पन्न होती है। गहरे रूप से नेस्टेड कॉलबैक से कोड रखरखाव योग्य नहीं रह जाता और त्रुटि-प्रवण हो जाता है। हालाँकि, प्रॉमिस और एसिंक/वेट की शुरूआत के साथ, डेवलपर्स के पास अब क्लीनर, अधिक प्रबंधनीय और स्केलेबल कोड लिखने के तरीके हैं।

वादे नेस्टेड कॉलबैक को समतल करता है और त्रुटि प्रबंधन को केंद्रीकृत करता है, जबकि async/await एसिंक्रोनस लॉजिक को सिंक्रोनस बनाकर सरल बनाता है। दोनों तकनीकें कॉलबैक नरक की अराजकता को खत्म करती हैं और यह सुनिश्चित करती हैं कि आपका कोड पढ़ने योग्य बना रहे, भले ही इसकी जटिलता बढ़ जाए।

सोशल मीडिया हैंडल
यदि आपको यह लेख उपयोगी लगा, तो अधिक जानकारी के लिए बेझिझक मेरे सोशल मीडिया चैनलों पर मुझसे जुड़ें:

  • गिटहब: [अमनजोतसिंह0908]
  • लिंक्डइन: [अमनजोत सिंह सैनी]
  • ट्विटर: [@AmanjotSingh]

पढ़ने के लिए धन्यवाद!

विज्ञप्ति वक्तव्य इस लेख को पुन: प्रस्तुत किया गया है: https://dev.to/amanjotsingh/understanding-callback-hell-the-problem-solutions-and-code-examples-3loh?1 यदि कोई उल्लंघन है, तो कृपया इसे हटाने के लिए [email protected] से संपर्क करें।
नवीनतम ट्यूटोरियल अधिक>

चीनी भाषा का अध्ययन करें

अस्वीकरण: उपलब्ध कराए गए सभी संसाधन आंशिक रूप से इंटरनेट से हैं। यदि आपके कॉपीराइट या अन्य अधिकारों और हितों का कोई उल्लंघन होता है, तो कृपया विस्तृत कारण बताएं और कॉपीराइट या अधिकारों और हितों का प्रमाण प्रदान करें और फिर इसे ईमेल पर भेजें: [email protected] हम इसे आपके लिए यथाशीघ्र संभालेंगे।

Copyright© 2022 湘ICP备2022001581号-3