उफ़, मैंने इसे फिर से किया: जावास्क्रिप्ट में सामान्य त्रुटियों को डीबग करना

जावास्क्रिप्ट कोड लिखना चुनौतीपूर्ण और कभी-कभी बेहद डराने वाला हो सकता है, जैसा कि कई डेवलपर्स परिचित हैं। कार्य की प्रक्रिया में, त्रुटियाँ अनिवार्य रूप से उत्पन्न होती हैं, और उनमें से कुछ बार-बार दोहराई जाती हैं। नौसिखिए डेवलपर्स के लिए लक्षित यह लेख इन त्रुटियों और उन्हें हल करने के तरीके के बारे में बात करता है। स्पष्टता के लिए, फ़ंक्शंस, गुणों और वस्तुओं के नाम यहां से लिए गए हैं लोकप्रिय गीत. यह सब आपको जल्दी से याद रखने में मदद करता है कि सामान्य गलतियों को कैसे ठीक किया जाए।

अनुस्मारक: "हैबर" के सभी पाठकों के लिए - "हैबर" प्रचार कोड का उपयोग करके किसी भी स्किलबॉक्स पाठ्यक्रम में नामांकन करते समय 10 रूबल की छूट।

स्किलबॉक्स अनुशंसा करता है: व्यावहारिक पाठ्यक्रम "मोबाइल डेवलपर प्रो".

लेखन त्रुटि: संपत्ति परिभाषित नहीं है

let girl = {
    name: "Lucky",
    location: "Hollywood",
    profession: "star",
    thingsMissingInHerLife: true,
    lovely: true,
    cry: function() {
        return "cry, cry, cries in her lonely heart"
    }
}
console.log(girl.named.lucky)

उपरोक्त उदाहरण कोड त्रुटि उत्पन्न करता है अनकॉट टाइप एरर: कैन्ट रीड प्रॉपर्टी 'लकी' ऑफ अनडिफाइंड। समस्या यह है कि लड़की वस्तु में नामित संपत्ति नहीं है, हालांकि इसमें नाम संपत्ति है। और चूंकि लड़की के नाम वाली संपत्ति परिभाषित नहीं है, आप उस तक नहीं पहुंच सकते, क्योंकि औपचारिक रूप से इसका अस्तित्व नहीं है। लेकिन अगर आप Girl.named.lucky को Girl.name से बदल दें, तो सब कुछ काम करेगा और प्रोग्राम Lucky लौट आएगा।

आप संपत्तियों के बारे में अधिक जान सकते हैं यहां पढ़ें.

टाइप एरर को कैसे हल करें

टाइप एरर तब होते हैं जब कोई प्रोग्रामर उस डेटा पर कार्रवाई करने का प्रयास करता है जो किसी विशिष्ट प्रकार से मेल नहीं खाता है। उदाहरणों में .bold() का उपयोग करना, एक अपरिभाषित संपत्ति के लिए पूछना, या किसी ऐसे फ़ंक्शन को कॉल करना शामिल है जो वास्तव में एक फ़ंक्शन नहीं है।

इसलिए, यदि आप गर्ल() को कॉल करने का प्रयास करते हैं, तो आपको त्रुटि मिलेगी अनकॉट टाइपएरर: योरवेरिएबल.बोल्ड एक फ़ंक्शन नहीं है और गर्ल एक फ़ंक्शन नहीं है, क्योंकि यह वास्तव में एक ऑब्जेक्ट है जिसे कॉल किया जा रहा है, कोई फ़ंक्शन नहीं।

त्रुटियों को दूर करने के लिए, आपको चरों का अध्ययन करने की आवश्यकता है। तो, लड़की क्या है? लड़की का नाम क्या है? आप कोड का विश्लेषण करके, कंसोल.लॉग, डिबगर कमांड का उपयोग करके वेरिएबल प्रदर्शित करके या कंसोल में वेरिएबल नाम को कॉल करके पता लगा सकते हैं। आपको यह सुनिश्चित करना होगा कि वेरिएबल में निहित डेटा प्रकार पर काम करना संभव है। यदि यह फिट नहीं होता है, तो इसे बदल दें, उदाहरण के लिए, एक शर्त या ट्राई..कैच ब्लॉक जोड़ें - और ऑपरेशन के निष्पादन पर नियंत्रण हासिल करें।

स्टैक ओवरफ़्लो

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

त्रुटियाँ इस प्रकार दिखती हैं:

त्रुटि: स्टैक स्पेस से बाहर (एज)
आंतरिक त्रुटि: बहुत अधिक प्रत्यावर्तन (फ़ायरफ़ॉक्स)
रेंजत्रुटि: अधिकतम कॉल स्टैक आकार पार हो गया (क्रोम)

स्टैक ओवरफ़्लो तब होता है जब डेवलपर रिकर्सन में बेस केस पर विचार नहीं करता है, या यदि कोड इच्छित केस को संबोधित नहीं करता है।

function oneMoreTime(stillBelieve=true, loneliness=0) {
    if (!stillBelieve && loneliness < 0) return
    loneliness++
    return oneMoreTime(stillBelieve, loneliness)
}

इस मामले में, स्टिलबिलीव कभी भी गलत नहीं हो सकता है, इसलिए हर बार oneMoreTime को कॉल किया जाएगा, लेकिन फ़ंक्शन कभी पूरा नहीं होगा।

अगर आप दो दोस्तों पर भरोसा करना शुरू कर दें तो इससे अकेलापन कम हो जाएगा और आपको कॉल का इंतजार नहीं करना पड़ेगा।

function oneMoreTime(stillBelieve=true, loneliness=0) {
    if (!stillBelieve && loneliness < 0) return
    loneliness--
    stillBelieve = false
    return oneMoreTime(stillBelieve, loneliness)
}

एक उदाहरण अनंत लूप वाले मामले हैं, जब सिस्टम एक त्रुटि संदेश उत्पन्न नहीं करता है, लेकिन जिस पृष्ठ पर जावास्क्रिप्ट कोड निष्पादित होता है वह बस रुक जाता है। ऐसा तब होता है जब while लूप में समाप्ति की स्थिति नहीं होती है।

let worldEnded = false
 
while (worldEnded !== true) {
  console.log("Keep on dancin' till the world ends")
}

आप समस्या को इस प्रकार हल कर सकते हैं:

let worldEnded = false
 
while (worldEnded !== true) {
  console.log("Keep on dancin' till the world ends")
  worldEnded = true
}

अनंत लूप और रिकर्सन को डीबग करना

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

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

आप इस सब के बारे में यहां अधिक पढ़ सकते हैं (क्रोम के लिए) और यहां (फ़ायरफ़ॉक्स के लिए).

वक्य रचना त्रुटि

जावास्क्रिप्ट में सबसे आम त्रुटियों में से एक SyntaxError है। टेक्स्ट एडिटर एक्सटेंशन आपको उनसे बचने में मदद करेंगे। उदाहरण के लिए, ब्रैकेट पेयर कलराइज़र विभिन्न रंगों के साथ कोड में ब्रैकेट को चिह्नित करता है, और प्रीटियर या एक समान विश्लेषण उपकरण त्रुटियों को तुरंत ढूंढना संभव बनाता है। सिंटैक्स त्रुटि की संभावना को कम करने का सबसे अच्छा विकल्प न्यूनतम नेस्टिंग है।

टिप्पणियों में साझा करें: गलतियों को रोकने या उन्हें शीघ्रता से पहचानने और समाप्त करने के लिए आप क्या करते हैं?

स्किलबॉक्स अनुशंसा करता है:

• दो वर्षीय व्यावहारिक पाठ्यक्रम "मैं एक PRO वेब डेवलपर हूं".
• ऑनलाइन पाठ्यक्रम "C# डेवलपर 0 से".
• व्यावहारिक वर्ष पाठ्यक्रम "PHP डेवलपर 0 से PRO तक".

स्रोत: www.habr.com