जावास्क्रिप्ट कोड का रिफैक्टरिंग: कब और कैसे प्रोजेक्ट को न तोड़ें

आपका कोड काम कर रहा है — लेकिन इसका मतलब यह नहीं कि वह अच्छा है

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

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

रिफैक्टरिंग क्या है और यह क्या नहीं है

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

कई लोग रिफैक्टरिंग को फिर से लिखने (rewriting) से भ्रमित करते हैं। ये अलग चीजें हैं। फिर से लिखने का मतलब है पुराने कोड को फेंककर नए सिरे से लिखना। रिफैक्टरिंग एक क्रांति नहीं, बल्कि विकास है। आप कोड को छोटे-छोटे कदमों में बदलते हैं, हर बार जाँचते हैं कि कुछ टूटा तो नहीं।

जावास्क्रिप्ट रिफैक्टरिंग कब करनी चाहिए?

यहाँ कुछ पक्के संकेत दिए गए हैं कि आपका कोड मदद के लिए चिल्ला रहा है:

\n
• तीन का नियम। यदि आप कोड के एक ही टुकड़े को तीसरी बार कॉपी कर रहे हैं — तो उसे एक अलग फंक्शन में निकालने का समय आ गया है।
\n
• राक्षस फंक्शन। 30–40 लाइनों से लंबा फंक्शन जिसे एक नज़र में पढ़ना असंभव है।
\n
• "मैजिक नंबर"। कोड में बिना कमेंट और कॉन्स्टेंट के 86400000 या 42 जैसे नंबर बिखरे हुए हैं।
\n
• ग्लोबल वेरिएबल। यदि आप किसी वेरिएबल को बदलने से डरते हैं क्योंकि नहीं जानते कि वह और कहाँ उपयोग हो रहा है।
\n
• टेस्ट। यदि आप बदलाव करने से डरते हैं क्योंकि कोई ऑटोमेटेड टेस्ट नहीं है — यह पहली चेतावनी है।
\n

लेकिन कुछ स्थितियाँ ऐसी भी हैं जहाँ रिफैक्टरिंग आवश्यक नहीं है: डेडलाइन से पहले, बिना टेस्ट के प्रोडक्शन में, या जब कोड प्रोटोटाइप के लिए जल्दबाजी में लिखा गया हो जिसे कल फेंक दिया जाएगा।

जावास्क्रिप्ट रिफैक्टरिंग तकनीकें: सरल से जटिल तक

1. फंक्शन निकालना (Extract Function)

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

// रिफैक्टरिंग से पहले\nfunction calculateInvoice(items) {\n  let total = 0;\n  for (let item of items) {\n    total += item.price * item.quantity;\n  }\n  let discount = 0;\n  if (total > 1000) {\n    discount = total * 0.1;\n  }\n  return total - discount;\n}\n\n// रिफैक्टरिंग के बाद\nfunction calculateSubtotal(items) {\n  return items.reduce((sum, item) => sum + item.price * item.quantity, 0);\n}\n\nfunction calculateDiscount(total) {\n  return total > 1000 ? total * 0.1 : 0;\n}\n\nfunction calculateInvoice(items) {\n  const subtotal = calculateSubtotal(items);\n  const discount = calculateDiscount(subtotal);\n  return subtotal - discount;\n}\n

क्या बदला? अब प्रत्येक फंक्शन एक ही काम के लिए जिम्मेदार है। आप calculateSubtotal का दूसरी जगह पुन: उपयोग कर सकते हैं, और calculateDiscount को अलग से आसानी से टेस्ट कर सकते हैं।

2. मैजिक नंबरों को कॉन्स्टेंट से बदलना

कोड में कभी भी "नंगे" नंबरों का उपयोग न करें। एक महीने बाद आपको खुद याद नहीं रहेगा कि 86400000 का क्या मतलब है।

// बुरा\nif (Date.now() - lastLogin > 86400000) {\n  // फिर से लॉगिन का अनुरोध करें\n}\n\n// अच्छा\nconst MILLISECONDS_IN_A_DAY = 24 * 60 * 60 * 1000;\nconst ONE_DAY_MS = 86400000; // या बस एक पढ़ने योग्य कॉन्स्टेंट\n\nif (Date.now() - lastLogin > ONE_DAY_MS) {\n  // फिर से लॉगिन का अनुरोध करें\n}\n

3. सशर्त संरचनाओं को सरल बनाना

जटिल नेस्टेड if-else पठनीयता का सबसे बड़ा दुश्मन है। अर्ली रिटर्न और टर्नरी ऑपरेटरों का उपयोग करें।

<