लेगसी कोड का TypeScript में रीफैक्टरिंग: चरण-दर-चरण मार्गदर्शिका

परिचय: TypeScript पर लीगेसी कोड का रिफैक्टरिंग क्यों ज़रूरी है

विरासत (legacy) कोड के साथ काम करना डेवलपर के सबसे आम और कठिन कार्यों में से एक है। अक्सर ऐसा कोड सख्त टाइपिंग के बिना शुद्ध JavaScript में लिखा जाता है, इसमें उलझी हुई निर्भरताएँ और मॉड्यूलर संरचना का अभाव होता है। TypeScript पर स्विच करना केवल टाइप जोड़ना नहीं है - यह कोड गुणवत्ता में एक मौलिक सुधार है जो बग की संख्या को कम करता है, रिफैक्टरिंग को सरल बनाता है और नए डेवलपर्स के ऑनबोर्डिंग को गति देता है।

इस लेख में, हम TypeScript पर लीगेसी कोड के रिफैक्टरिंग की चरण-दर-चरण प्रक्रिया पर चर्चा करेंगे। आप सीखेंगे कि कैसे सुरक्षित रूप से टाइप लागू करें, मोनोलिथिक फंक्शन को तोड़ें और परिवर्तनों का परीक्षण करें।

चरण 1. लीगेसी कोड का विश्लेषण और तैयारी

कोड लिखने से पहले, वर्तमान आर्किटेक्चर को समझना आवश्यक है। इसके बिना, रिफैक्टरिंग अराजकता में बदल जाएगा।

निर्भरता मानचित्र बनाएँ

फ़ाइलों और मॉड्यूल के विश्लेषण से शुरुआत करें। निर्धारित करें:

• कौन से फंक्शन "शुद्ध" (pure) हैं और किनके साइड इफेक्ट हैं।
• ग्लोबल वेरिएबल और स्टेट कहाँ स्थित हैं।
• कोड के कौन से हिस्से डुप्लिकेट हैं।

महत्वपूर्ण भागों के लिए टेस्ट लिखें

बिना टेस्ट के रिफैक्टरिंग रूसी रूलेट खेलने जैसा है। मुख्य फंक्शन के लिए कम से कम यूनिट टेस्ट लिखें। TypeScript पर टेस्ट का उदाहरण:

// मूल लीगेसी कोड (JavaScript)function calculatePrice(items) {    let total = 0;    for (let i = 0; i < items.length; i++) {        total += items[i].price * items[i].quantity;    }    return total;}

// TypeScript पर टेस्ट (Jest)describe('calculatePrice', () => {    it('should calculate total price correctly', () => {        const items = [            { price: 10, quantity: 2 },            { price: 5, quantity: 3 }        ];        expect(calculatePrice(items)).toBe(35);    });});

यदि टेस्ट पास हो जाते हैं, तो रिफैक्टरिंग शुरू की जा सकती है।

चरण 2. सख्त टाइपिंग का क्रमिक कार्यान्वयन

एक साथ सभी चीज़ों को टाइप से कवर करने का प्रयास न करें। "नीचे से ऊपर" रणनीति का उपयोग करें: सबसे सरल और पृथक फंक्शन से शुरुआत करें।

सरल फंक्शन की टाइपिंग

पैरामीटर और रिटर्न वैल्यू के लिए टाइप जोड़ें। उदाहरण:

// पहले था (JavaScript)function greet(name) {    return "Hello, " + name;}

// अब है (TypeScript)function greet(name: string): string {    return `Hello, ${name}`;}

ऑब्जेक्ट और इंटरफ़ेस के साथ काम करना

जटिल डेटा संरचनाओं के लिए इंटरफ़ेस बनाएँ। यह कोड को स्व-दस्तावेजीकरण बनाता है:

// ऑर्डर आइटम के लिए इंटरफ़ेस परिभाषित करेंinterface OrderItem {    id: number;    name: string;    price: number;    quantity: number;}

// टाइप किए गए पैरामीटर वाला फंक्शनfunction getTotalPrice(items: OrderItem[]): number {    return items.reduce((sum, item) => sum + item.price * item.quantity, 0);}

`any` का उपयोग केवल अस्थायी समाधान के रूप में करें

any टाइप सख्त टाइपिंग का दुश्मन है। यदि आप सटीक टाइप नहीं जानते हैं, तो unknown का उपयोग करें और runtime पर इसकी जाँच करें:

function safeParse(data: unknown): string {    if (typeof data === 'string') {        return data.trim();    }    return '';}

चरण 3. मोनोलिथिक फंक्शन और मॉड्यूल का विभाजन

लीगेसी कोड में अक्सर "गॉड फंक्शन" (god functions) होते हैं जो सब कुछ एक साथ करते हैं। उन्हें छोटे, पुन: प्रयोज्य मॉड्यूल में तोड़ें।

शुद्ध लॉजिक को अलग करना

उदाहरण: एक फंक्शन जो ईमेल को मान्य करता है और अनुरोध भेजता है। इसे विभाजित करें:

// पहले था (मोनोलिथ)function processUser(email) {    if (!email || !email.includes('@')) {        throw new Error('Invalid email');    }    // ... अनुरोध भेजना    console.log('Sending request...');}

// अब है (जिम्मेदारी का विभाजन)function validateEmail(email: string): boolean {    return email
```