जावास्क्रिप्ट त्रुटियों के 5 सामान्य कारण (और उनसे कैसे बचें)

जावास्क्रिप्ट (JS) एक सर्वव्यापी, लचीली, और व्यापक रूप से लोकप्रिय प्रोग्रामिंग भाषा है – हालांकि यह उन त्रुटियों और बगों से भी ग्रस्त है जो अधिकांश डेवलपर्स को भटका और सनकी बनाते हैं.


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

जावास्क्रिप्ट दोष के कारण अनपेक्षित परिणाम उत्पन्न होते हैं और उपयोगकर्ता अनुभव को नुकसान पहुँचाते हैं। हाल ही में अध्ययन ब्रिटिश कोलंबिया विश्वविद्यालय (यूबीसी) ने जावास्क्रिप्ट त्रुटियों और बग के मूल कारणों और प्रभाव का पता लगाने की मांग की। अध्ययन के परिणामों ने कुछ सामान्य पैटर्न को उजागर किया जो जेएस कार्यक्रमों के प्रदर्शन को बिगड़ा.

यहाँ एक पाई चार्ट दिखाया गया है जो शोधकर्ताओं ने पाया:

इस ब्लॉग पोस्ट में, हम अध्ययन में उजागर किए गए जावास्क्रिप्ट दोषों के कुछ सामान्य कारणों का वर्णन करेंगे (साथ ही अन्य जो हम प्रतिदिन मुठभेड़ करते हैं) और अपने अनुप्रयोगों को विफलताओं से कम करने का तरीका बताते हैं।.

डोम से संबंधित

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

इसलिए, यहां तक ​​कि Node.js जैसी बैकएंड जावास्क्रिप्ट तकनीकों की शुरूआत के साथ, DOM के साथ काम करना अभी भी भाषा का एक बड़ा हिस्सा बनाता है। इसलिए, जावास्क्रिप्ट अनुप्रयोगों में बग और त्रुटियों को शुरू करने के लिए DOM एक महत्वपूर्ण एवेन्यू है.

यह आश्चर्य की बात नहीं है कि जावास्क्रिप्ट बग रिपोर्ट अध्ययन में पाया गया कि डोम-संबंधित मुद्दे 68% से अधिक खामियों के लिए जिम्मेदार हैं।.

उदाहरण के लिए, कुछ जावास्क्रिप्ट प्रोग्रामर आमतौर पर DOM तत्वों को लोड करने से पहले संदर्भित करने की गलती करते हैं, जिससे कोड त्रुटियां होती हैं.

document.getElementById ("पात्र") .innerHTML = "आम जेएस कीड़े और त्रुटियाँ";

यदि ऊपर का कोड क्रोम ब्राउज़र पर चलाया जाता है, तो यह एक त्रुटि देगा, जिसे डेवलपर कंसोल पर देखा जा सकता है:

त्रुटि को फेंक दिया जाता है क्योंकि जावास्क्रिप्ट कोड आमतौर पर एक दस्तावेज पर दिखाई देने वाले आदेश के अनुसार निष्पादित किया जाता है। जैसे, जब कोड चलता है तो ब्राउज़र संदर्भित तत्व से अनजान है.

ऐसी समस्या को हल करने के लिए, आप विभिन्न तरीकों का उपयोग कर सकते हैं। सबसे आसान तरीका स्क्रिप्ट टैग की शुरुआत से पहले जगह है। आप यह सुनिश्चित करने के लिए कि इसे एक्सेस करने से पहले DOM को पहले लोड किया गया है, jQuery जैसी जावास्क्रिप्ट लाइब्रेरी का उपयोग कर सकते हैं.

document.getElementById ("पात्र") .innerHTML = "आम जेएस कीड़े और त्रुटियाँ";

सिंटेक्स आधारित

जब सिंटैक्ट त्रुटिपूर्ण गलत कोड निष्पादित करने में विफल रहता है तो सिंटैक्स त्रुटियां होती हैं। यदि कोई एप्लिकेशन बनाता है और इंटरप्रिटर टोकन प्रोग्रामिंग भाषा के मानक सिंटैक्स के साथ मेल नहीं खाता है, तो यह एक त्रुटि फेंक देगा। जावास्क्रिप्ट बग रिपोर्ट अध्ययन के अनुसार, ऐसी त्रुटियां भाषा की सभी त्रुटियों के 12% के लिए जिम्मेदार हैं.

व्याकरण संबंधी गलतियाँ, जैसे लापता कोष्ठक या बेजोड़ कोष्ठक, जावास्क्रिप्ट में वाक्यविन्यास त्रुटियों के प्रमुख कारण हैं.

उदाहरण के लिए, जब आपको कई शर्तों को संबोधित करने के लिए सशर्त बयानों का उपयोग करना चाहिए, तो आप कोष्ठकों को आवश्यक रूप से उपलब्ध कराने से चूक सकते हैं, जिससे वाक्यविन्यास को बढ़ावा मिलेगा।.

आइए निम्नलिखित उदाहरण देखें.

अगर ((एक्स > वाई) && (y < 77) {
// यहाँ और अधिक कोड
}

हां, सशर्त विवरण का अंतिम कोष्ठक गायब है। क्या आपने ऊपर दिए गए कोड के साथ गलती देखी है?

चलो इसे सही करें.

अगर (x) > वाई) && (y < 77)) {
// यहाँ और अधिक कोड
}

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

अपरिभाषित / अशक्त कीवर्ड का अनुचित उपयोग

कुछ जावास्क्रिप्ट डेवलपर्स को पता नहीं है कि कैसे उपयोग करना है अपरिभाषित तथा शून्य सही ढंग से कीवर्ड। वास्तव में, अध्ययन ने बताया कि सभी जावास्क्रिप्ट बग के 5% के लिए कीवर्ड का अनुचित उपयोग होता है.

शून्य कीवर्ड एक असाइनमेंट वैल्यू है, जिसे आम तौर पर एक गैर-मौजूद मूल्य को दर्शाने के लिए एक चर को सौंपा जाता है। हैरानी की बात है, शून्य एक जावास्क्रिप्ट ऑब्जेक्ट भी है.

यहाँ एक उदाहरण है:

var codeJS = null;

console.log (codeJS);
// आउटपुट शून्य है

कंसोल.लॉग (टाइपोफ़ कोडजेएस);
// आउटपुट ऑब्जेक्ट है

दूसरी ओर, अपरिभाषित इंगित करता है कि एक चर या कोई अन्य संपत्ति, जिसे पहले ही घोषित किया गया है, में एक निर्धारित मूल्य का अभाव है। इसका मतलब यह भी हो सकता है कि कुछ भी घोषित नहीं किया गया है. अपरिभाषित स्वयं का एक प्रकार है.

यहाँ एक उदाहरण है:

var codeJS;

console.log (codeJS);
// आउटपुट अपरिभाषित है

कंसोल.लॉग (टाइपोफ़ कोडजेएस);
// आउटपुट अपरिभाषित है

दिलचस्प है, अगर समानता ऑपरेटर और पहचान ऑपरेटर की तुलना करने के लिए उपयोग किया जाता है शून्य तथा अपरिभाषित कीवर्ड, बाद वाले उन्हें समान नहीं मानते हैं.

console.log (शून्य == अपरिभाषित);
// आउटपुट सच है

console.log (शून्य === अपरिभाषित);
// आउटपुट झूठा है

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

अपरिभाषित तरीके

जावास्क्रिप्ट में बग का एक और आम कारण इसकी पूर्व परिभाषा प्रदान किए बिना एक विधि को कॉल करना है। यूबीसी शोधकर्ताओं ने पाया कि यह गलती जावास्क्रिप्ट की सभी त्रुटियों का 4% है.

यहाँ एक उदाहरण है:

var कोडर = {
नाम: "पीटर",
उम्र: 27,
बोले() {
console.log (this.name);
}
};
coder.speakNow ();

यहाँ Chrome डेवलपर कंसोल पर त्रुटि देखी गई है:

उपरोक्त त्रुटि इसलिए होती है क्योंकि जावास्क्रिप्ट फ़ंक्शन में स्पैनिश फ़ंक्शन स्पोक नाउ () को परिभाषित नहीं किया गया है.

रिटर्न स्टेटमेंट का अनुचित उपयोग

जावास्क्रिप्ट में वापसी स्टेटमेंट का उपयोग किसी फ़ंक्शन को चलाने से रोकने के लिए किया जाता है ताकि उसका मान आउटपुट किया जा सके। यदि गलती से उपयोग किया जाता है, तो रिटर्न स्टेटमेंट अनुप्रयोगों के इष्टतम प्रदर्शन को ख़राब कर सकता है। अध्ययन के अनुसार, रिटर्न स्टेटमेंट के गलत उपयोग से जावास्क्रिप्ट एप्लिकेशनों में सभी बगों का 2% हिस्सा होता है.

उदाहरण के लिए, कुछ जावास्क्रिप्ट प्रोग्रामर आमतौर पर रिटर्न स्टेटमेंट को गलत तरीके से तोड़ने की गलती करते हैं.

जब आप जावास्क्रिप्ट स्टेटमेंट को दो लाइनों में तोड़ सकते हैं और अभी भी आवश्यक आउटपुट प्राप्त कर सकते हैं, तो रिटर्न स्टेटमेंट को तोड़ना आपके आवेदन में आपदा को आमंत्रित कर रहा है.

यहाँ एक उदाहरण है:

फ़ंक्शन संख्या (n) {
var add = 5;
वापसी;
n + जोड़;
}
console.log (संख्या (10));

जब उपरोक्त कोड चलाया जाता है, तो Chrome डेवलपर कंसोल पर एक अपरिभाषित त्रुटि देखी जाती है:

इसलिए, आपको टूटने से बचना चाहिए वापसी आपके जावास्क्रिप्ट कोड में बयान.

निष्कर्ष

क्लाइंट-साइड जावास्क्रिप्ट प्रोग्रामिंग भाषा आधुनिक वेब अनुप्रयोगों की कार्यक्षमता को शक्ति प्रदान करने के लिए उत्कृष्ट व्यापक क्षमताओं के साथ आती है। हालांकि, अगर आप भाषा के काम करने वाले क्विर्क को नहीं समझते हैं, तो आपके अनुप्रयोगों का प्रदर्शन अपंग हो सकता है.

और भी, जावास्क्रिप्ट डेवलपर्स अपने अनुप्रयोगों के प्रदर्शन के निवारण और बग और त्रुटियों का शीघ्र पता लगाने के लिए बहुमुखी उपकरणों की आवश्यकता होती है.

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

हैप्पी त्रुटि मुक्त जावास्क्रिप्ट प्रोग्रामिंग!

अल्फरिक ओपीडी द्वारा लिखित लेख

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map