HI
RU
EN
ES
ZH
FR
DE
PT
AR
परिचय: जब कोड में 'बदबू' आने लगती है
\n\nहर डेवलपर इस भावना को जानता है। आप एक फ़ाइल खोलते हैं जो आपने तीन महीने पहले लिखी थी, और आपका चेहरा लंबा हो जाता है। आत्मा की गहराइयों में कहीं, आप एक फुसफुसाहट सुनते हैं: 'यह मैंने नहीं लिखा, यह कोई नौसिखिया था'। लेकिन पीछे का दर्पण निर्दयी है: वह आप ही थे। कोड काम करता है, टेस्ट पास होते हैं, लेकिन हर नई सुविधा जोड़ने पर आप अधिक समय खर्च करते हैं। परिचित लगता है?
\n\nयह वह क्षण है जब TypeScript कोड के रिफैक्टरिंग के बारे में सोचने का समय है। सब कुछ शून्य से फिर से लिखने के बारे में नहीं (यह नरक का रास्ता है), बल्कि सर्जिकल सटीक सुधारों के बारे में जो कोड को साफ, समझने योग्य और सुरक्षित बनाते हैं। इस लेख में, हम चर्चा करेंगे कि कब रिफैक्टरिंग शुरू करनी चाहिए, कैसे इसे बिना दर्द के करना है और क्यों TypeScript आपको इस प्रक्रिया के लिए सुपरपावर देता है।
\n\nTypeScript कोड का रिफैक्टरिंग कब करना चाहिए?
\n\nएक मिथक है कि रिफैक्टरिंग स्प्रिंट में एक अलग कार्य है। व्यवहार में, सबसे अच्छा रिफैक्टरिंग एक सतत प्रक्रिया है। लेकिन कुछ स्पष्ट संकेत हैं जो चिल्लाते हैं: 'रुको! यहाँ व्यवस्था की जरूरत है!'
\n\nतीन का नियम (और दो और)
\nयदि आपने कोड का एक ही टुकड़ा तीन बार कॉपी किया है - तो इसे एक फंक्शन या क्लास में निकाल लें। यदि आप देखते हैं कि एक सहकर्मी ने आपका कोड कॉपी किया है - यह चौथी बार है। TypeScript अपनी सख्त टाइपिंग के साथ इस नियम को विशेष रूप से महत्वपूर्ण बनाता है: प्रकारों का दोहराव डेटा के डीसिंक्रोनाइजेशन की ओर ले जाता है।
\n\nTypeScript में 'गंदे' कोड के लक्षण
\n- \n
- Any-अराजकता: यदि आपके प्रोजेक्ट में
anystringसे अधिक बार आता है - यह एक लाल झंडा है। TypeScript अपना अर्थ खो देता है। \n - राक्षस फंक्शन: 200+ लाइनों का फंक्शन जो सब कुछ करता है: मान्य करना, पार्स करना, अनुरोध भेजना और इंटरफ़ेस बनाना। \n
- 'जादुई' संख्याएँ और स्ट्रिंग्स:
if (status === 3)- 3 क्या है? कोई नहीं जानता, सिवाय लेखक के जो पहले ही नौकरी छोड़ चुका है। \n - DRY सिद्धांत का उल्लंघन: समान इंटरफ़ेस 10 फ़ाइलों में बिखरे हुए हैं। \n
- टेस्ट कोड से भी बदतर: यदि एक फंक्शन का परीक्षण करने के लिए सर्वर, डेटाबेस और डॉकर चलाने की आवश्यकता है - आप गलत रास्ते पर हैं। \n
मुख्य नियम याद रखें: TypeScript कोड का रिफैक्टरिंग तब किया जाना चाहिए जब एक नई सुविधा जोड़ने में उसे शून्य से लिखने से अधिक समय लगता है। यह सत्य का क्षण है।
\n\nबुनियादी सिद्धांत: प्रोडक्शन को कैसे न तोड़ें
\n\nरिफैक्टरिंग शुरू करने से पहले, तीन स्तंभों को याद रखें जिन पर सुरक्षित रिफैक्टरिंग टिकी है:
\n\n- \n
- टेस्ट - आपका बीमा। टेस्ट कवरेज के बिना रिफैक्टरिंग रूसी रूलेट है। शुरू करने से पहले कम से कम बुनियादी यूनिट टेस्ट लिखें। \n
- छोटे कदम। एक रात में पूरे प्रोजेक्ट को रिफैक्टर करने की कोशिश न करें। एक मॉड्यूल - एक कमिट। \n
- TypeScript कंपाइलर - आपका मित्र। सख्त सेटिंग्स
tsconfig.jsonका उपयोग करें:strict: true- यह आपका झूठ डिटेक्टर है। \n
TypeScript पर उदाहरणों के साथ व्यावहारिक रिफैक्टरिंग तकनीकें
\n\nआइए सबसे दिलचस्प भाग - कोड पर चलते हैं। हम तीन वास्तविक स्थितियों पर विचार करेंगे और दिखाएंगे कि उन्हें कैसे सुधारें।
\n\n1. any से छुटकारा: जेनेरिक की शक्ति
\n\nखराब उदाहरण। फंक्शन कुछ भी स्वीकार करता है और कुछ भी लौटाता है। यह TypeScript नहीं है, यह मास्क पहने JavaScript है।
\n\n// बुरा: any टाइपिंग को मारता है\nfunction getFirstElement(arr: any[]): any {\n if (arr.length === 0) {\n throw new Error('Array is empty');\n }\n return arr[0];\n}\n\nconst num = getFirstElement([1, 2, 3]); // num: any\nconsole.log(num.toUpperCase()); // रनटाइम में त्रुटि, लेकिन कंपाइलर चुप है\nअच्छा उदाहरण। जेनेरिक का उपयोग करें। कोड सुरक्षित हो जाता है, और IDE प्रकारों का सुझाव देता है।
\n\n// अच्छा: जेनेरिक बचाते हैं\nfunction getFirstElement<T>(arr: T[]): T {\n if (arr.length === 0) {\n throw new Error('Array is em 
