🥇उफ्, मैले फेरि गरें: सामान्य जाभास्क्रिप्ट त्रुटिहरू डिबग गर्दै

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

हामी सम्झाउँछौं: सबै Habr पाठकहरूका लागि - Habr प्रोमो कोड प्रयोग गरी कुनै पनि Skillbox पाठ्यक्रममा भर्ना गर्दा १०,००० रूबल छुट।

Skillbox सिफारिस गर्दछ: व्यावहारिक पाठ्यक्रम "मोबाइल विकासकर्ता प्रो".

TypeError: गुण परिभाषित गरिएको छैन

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)

माथिको उदाहरण कोडले त्रुटि "Uncaught TypeError: Cannot read property of undefined" फर्काउँछ। समस्या यो हो कि girl object मा named property छैन, यद्यपि यसमा name property छ। र girl.named property परिभाषित नभएकोले, यसलाई पहुँच गर्न सकिँदैन, किनभने औपचारिक रूपमा यो अवस्थित छैन। तर यदि तपाईंले girl.named.lucky लाई girl.name ले बदल्नुभयो भने, सबै कुरा काम गर्नेछ र प्रोग्रामले Lucky फर्काउनेछ।

सम्पत्तीहरूको बारेमा थप विवरणहरू फेला पार्न सकिन्छ यहाँ पढ्नुहोस्.

TypeErrors समस्या निवारण गर्ने तरिकाहरू

TypeError त्रुटिहरू तब हुन्छन् जब प्रोग्रामरले परिभाषित प्रकारको नभएको डेटामा कार्य गर्ने प्रयास गर्छ। उदाहरणहरूमा .bold() प्रयोग गर्ने, अपरिभाषित गुणको लागि क्वेरी गर्ने, वा वास्तवमा प्रकार्य नभएको प्रकार्यलाई कल गर्ने समावेश छन्।

त्यसैले, यदि तपाईंले girl() लाई कल गर्ने प्रयास गर्नुभयो भने, तपाईंले Uncaught TypeError त्रुटि पाउनुहुनेछ: yourVariable.bold कुनै फंक्शन होइन र girl कुनै फंक्शन होइन, किनकि वास्तवमा कुनै वस्तुलाई कल गरिन्छ, फंक्शन होइन।

समस्या निवारण गर्न, तपाईंले चरहरू जाँच गर्नुपर्छ। त्यसोभए, केटी भनेको के हो? र केटी.नाम के हो? तपाईंले कोड विश्लेषण गरेर, console.log प्रयोग गरेर चरहरू प्रदर्शन गरेर, डिबगर आदेश प्रयोग गरेर, वा कन्सोलमा चर नाम कल गरेर पत्ता लगाउन सक्नुहुन्छ। तपाईंले चरमा समावेश डेटा प्रकारमा सञ्चालन गर्न सक्नुहुन्छ भनेर सुनिश्चित गर्न आवश्यक छ। यदि यो फिट हुँदैन भने, यसलाई परिवर्तन गर्नुहोस्, उदाहरणका लागि, सर्त वा try..catch ब्लक थप्नुहोस् — र अपरेशनको कार्यान्वयनमा नियन्त्रण प्राप्त गर्नुहोस्।

स्ट्याक ओभरफ्लो

यदि तपाईं बेबी वन मोर टाइम गीतका गीतकारहरू (त्यो ब्रिटनी स्पीयर्स हो, हो) लाई विश्वास गर्नुहुन्छ भने, यस सन्दर्भमा हिट शब्दको अर्थ गायकको फेरि बोलाइने इच्छा हो (यहाँ गीतको सन्दर्भको व्याख्या छ, — अनुवादकको नोट)। यो चाहनाले वास्तविक जीवनमा कलहरूको संख्यामा वृद्धि गराउने हुन सक्छ। तर प्रोग्रामिङमा, यो पुनरावृत्ति हो, जसले कल स्ट्याक ओभरफ्लोको घटनामा त्रुटि निम्त्याउन सक्छ।

त्रुटिहरू यस प्रकार देखिन्छन्:

त्रुटि: स्ट्याक स्पेस सकियो (एज)
आन्तरिक त्रुटि: धेरै धेरै पुनरावृत्ति (फायरफक्स)
RangeError: अधिकतम कल स्ट्याक आकार नाघ्यो (Chrome)

स्ट्याक ओभरफ्लो तब हुन्छ जब विकासकर्ताले रिकर्सनमा आधार केसलाई ध्यानमा राख्दैन, वा जब कोडले अभिप्रेत केसलाई सम्बोधन गर्दैन।

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

यस अवस्थामा, stillBelieve ले कहिल्यै पनि false मा मूल्याङ्कन गर्न सक्दैन, त्यसैले 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
}

अनन्त लूपहरू र पुनरावृत्तिहरू डिबग गर्दै

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

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

तपाईं यी सबैको बारेमा यहाँ थप पढ्न सक्नुहुन्छ (Chrome को लागि) र यहाँ (फायरफक्सको लागि).

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

जाभास्क्रिप्टमा सबैभन्दा सामान्य त्रुटिहरू मध्ये एक SyntaxError हो। टेक्स्ट एडिटर एक्सटेन्सनले तिनीहरूलाई रोक्न मद्दत गर्न सक्छ। उदाहरणका लागि, Bracket Pair Colorizer ले कोडमा विभिन्न रङहरूमा कोष्ठकहरू चिन्ह लगाउँछ, र Prettier वा समान विश्लेषण उपकरणले तपाईंलाई द्रुत रूपमा त्रुटिहरू फेला पार्न अनुमति दिन्छ। SyntaxError को सम्भावना कम गर्ने उत्तम विकल्प भनेको न्यूनतम नेस्टिङ हो।

टिप्पणीहरूमा साझा गर्नुहोस्: गल्तीहरूबाट बच्न वा तिनीहरूलाई छिटो पत्ता लगाउन र हटाउन तपाईं के गर्नुहुन्छ?

Skillbox सिफारिस गर्दछ:

दुई वर्षे व्यावहारिक पाठ्यक्रम "म एक प्रो वेब विकासकर्ता हुँ".

अनलाइन कोर्स "0 बाट C# विकासकर्ता".

एक वर्षको व्यावहारिक पाठ्यक्रम "0 देखि PRO मा PHP विकासकर्ता".

स्रोत: www.habr.com