JavaScript पर कोड रिव्यू: क्या जांचें ताकि कोड बिखर न जाए

JavaScript पर कोड रिव्यू: क्या जांचें ताकि कोड बिखर न जाए

क्या आपने कभी किसी और का pull request खोला है और महसूस किया है कि अंदर सब कुछ सिकुड़ रहा है? जैसे आप तारों की एक उलझी हुई गुत्थी देख रहे हों, जहाँ हर गाँठ एक संभावित बग है। JavaScript पर कोड रिव्यू सिर्फ टास्क-ट्रैकर में एक टिक नहीं है। यह अराजकता से आपकी अंतिम सुरक्षा रेखा है। खासकर JS की गतिशील दुनिया में, जहाँ टाइपिंग एक भ्रम है, और 'जादुई' व्यवहार सामान्य है।

इस लेख में, मैं बताऊंगा कि JavaScript कोड की समीक्षा करते समय वास्तव में किन चीज़ों पर ध्यान देना चाहिए। टैब बनाम स्पेस की बेकार बहसों को भूल जाइए। हम उन चीज़ों के बारे में बात करेंगे जो सीधे स्थिरता, पठनीयता और प्रदर्शन को प्रभावित करती हैं। यह वही कोड रिव्यू चेकलिस्ट है जिसका उपयोग मैं स्वयं करता हूँ।

1. फ़ंक्शन की शुद्धता और साइड-इफेक्ट्स का अभाव

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

क्या जांचें:

\n
• आर्गुमेंट्स की संख्या: आदर्श रूप से 0, अधिकतम 3। यदि अधिक हैं, तो उन्हें कॉन्फ़िग ऑब्जेक्ट में डालें।
\n
• इनपुट डेटा का म्यूटेशन: फ़ंक्शन को पास किए गए ऐरे या ऑब्जेक्ट को नहीं बदलना चाहिए। यह एक हार्डकोर बग है जिसे पकड़ना मुश्किल है।
\n
• साइड इफेक्ट्स: बाहरी दुनिया में कोई भी बदलाव (console.log, फ़ाइल में लिखना, DOM में बदलाव) स्पष्ट और उचित होना चाहिए।
\n

खराब उदाहरण:

let totalUsers = 0;\n\nfunction processUsers(users) {\n    for (let i = 0; i < users.length; i++) {\n        users[i].active = true; // इनपुट डेटा का म्यूटेशन!\n        totalUsers++;           // साइड इफेक्ट!\n        console.log(users[i]);  // एक और साइड इफेक्ट\n    }\n    return users;\n}

अच्छा उदाहरण:

function activateUsers(users) {\n    return users.map(user => ({ ...user, active: true }));\n}\n\n// उपयोग:\nconst activeUsers = activateUsers(users);\nconsole.log(`सक्रिय: ${activeUsers.length}`);

याद रखें: शुद्ध फ़ंक्शन पूर्वानुमानित कोड की नींव हैं। यदि कोड रिव्यू में आपको म्यूटेशन दिखता है - तो बेझिझक टिप्पणी लिखें। JavaScript में यह मुश्किल से पकड़ में आने वाले बगों के मुख्य कारणों में से एक है।

2. अतुल्यकालिकता: प्रॉमिस और async/await

JS अतुल्यकालिकता का राजा है, लेकिन कॉलबैक-नरक का भी राजा है। समीक्षा करते समय ध्यान दें कि अतुल्यकालिक संचालन कैसे संभाले जाते हैं। JavaScript कोड की जांच प्रॉमिस चेन के विश्लेषण के बिना बेकार है।

लाल झंडे:

\n
• त्रुटि प्रबंधन का अभाव: कोई .catch() या try/catch नहीं। देर-सबेर यह एप्लिकेशन को क्रैश कर देगा।
\n
• नेस्टेड प्रॉमिस: यदि आप .then() के अंदर .then() देखते हैं - तो यह रीफैक्टरिंग का कारण है।
\n
• भूला हुआ await: फ़ंक्शन को async के रूप में चिह्नित किया गया है, लेकिन अंदर कॉल await के बिना हैं। परिणाम - डेटा के बजाय undefined।
\n

खराब उदाहरण (त्रुटि प्रबंधन का अभाव):

async function fetchUserData(userId) {\n    const response = await fetch(`/api/users/${userId}`);\n    const data = await response.json();\n    return data;\n}

अच्छा उदाहरण:

async function fetchUserData(userId) {\n    try {\n        const response = await fetch(`/api/users/${userId}`);\n        if (!response.ok) {\n            throw new Error(`HTTP error! status: ${response.status}`);\n        }\n        return await response.json();\n    } catch (error) {\n        console.error('उपयोगकर्ता लोड करने में त्रुटि:', error);\n        throw error; // आगे भेजें, लेकिन लॉग करें\n    }\n}

समीक्षक के लिए सलाह: हमेशा स्पष्टीकरण मांगें कि try/c