HI
RU
EN
ES
ZH
FR
DE
PT
AR
JavaScript कोड रिव्यू: Senior डेवलपर्स को वास्तव में क्या परेशान करता है
\n\nहर डेवलपर को कभी न कभी पुल-रिक्वेस्ट पर ऐसा कमेंट मिलता है जैसे "यहाँ बेहतर तरीके से लिखो" या "यह एंटीपैटर्न है"। अगर आप Junior या Middle हैं, तो ऐसी टिप्पणियाँ अक्सर नुकस-निकाली लगती हैं। लेकिन Senior डेवलपर के हर शब्द के पीछे असली अनुभव होता है: प्रोडक्शन में आई समस्या, रात के तीन बजे का बग, या परफॉरमेंस का गिरना।
\n\nहमने वे सबसे आम टिप्पणियाँ इकट्ठी की हैं जो Senior डेवलपर्स JavaScript कोड रिव्यू में करते हैं। यह सिर्फ "यह गलत है, यह सही है" की सूची नहीं है। बल्कि यह समझाता है कि क्यों एक खास तरीका गलत माना जाता है और उसकी जगह क्या इस्तेमाल करना चाहिए।
\n\nयह लेख उन सभी के लिए उपयोगी है जो JS में कोड लिखते हैं: शुरुआत से लेकर अनुभवी डेवलपर्स तक, जो अपने कोड की गुणवत्ता बढ़ाना चाहते हैं।
\n\n1. इनपुट डेटा का म्यूटेशन: सबसे बड़ा पाप
\n\nकोड रिव्यू में सबसे आम गलतियों में से एक है फंक्शन में पास किए गए ऑब्जेक्ट या ऐरे को बदलना। Senior डेवलपर्स को यह इसलिए पसंद नहीं क्योंकि म्यूटेशन इम्यूटेबिलिटी को तोड़ता है और मुश्किल से पकड़ में आने वाले बग पैदा करता है।
\n\nगलत उदाहरण
\nfunction addUser(users, newUser) {\n users.push(newUser); // मूल ऐरे को बदल रहा है!\n return users;\n}\n\nconst allUsers = [{ id: 1 }, { id: 2 }];\nconst updated = addUser(allUsers, { id: 3 });\nconsole.log(allUsers.length); // 3 — मूल ऐरे बदल गया!सही तरीका
\nfunction addUser(users, newUser) {\n return [...users, newUser]; // नया ऐरे लौटा रहे हैं\n}\n\nconst allUsers = [{ id: 1 }, { id: 2 }];\nconst updated = addUser(allUsers, { id: 3 });\nconsole.log(allUsers.length); // 2 — मूल ऐरे सुरक्षितयह क्यों ज़रूरी है: जब आप इनपुट डेटा को बदलते हैं, तो उसी ऑब्जेक्ट को रेफर करने वाला कोई भी दूसरा कोड अप्रत्याशित बदलाव देखता है। यह async ऑपरेशन, Redux स्टोर और React स्टेट में बग का सीधा रास्ता है।
\n\n2. मैजिक नंबर और स्ट्रिंग: पढ़ने में कठिनाई
\n\nSenior डेवलपर्स अक्सर कमेंट में लिखते हैं: "यह 86400 नंबर क्या है?" या "यह स्ट्रिंग कहाँ से आई?"। मैजिक वैल्यू कोड को समझने में मुश्किल बनाती हैं और उसकी मेंटेनेंस को जटिल करती हैं।
\n\nगलत उदाहरण
\nfunction calculateDiscount(price) {\n if (price > 1000) {\n return price * 0.9;\n }\n return price * 0.95;\n}सही तरीका
\nconst DISCOUNT_THRESHOLD = 1000;\nconst HIGH_DISCOUNT_RATE = 0.9;\nconst STANDARD_DISCOUNT_RATE = 0.95;\n\nfunction calculateDiscount(price) {\n if (price > DISCOUNT_THRESHOLD) {\n return price * HIGH_DISCOUNT_RATE;\n }\n return price * STANDARD_DISCOUNT_RATE;\n}सुझाव: सभी कॉन्स्टेंट को नाम वाले वेरिएबल या अलग कॉन्फिग फाइल में रखें। इससे JavaScript कोड रिव्यू आसान होता है और कोड खुद-ब-खुद डॉक्यूमेंटेड हो जाता है।
\n\n3. async/await और प्रॉमिस में गलतियाँ
\n\nएसिंक्रोनस कोड वह क्षेत्र है जहाँ Middle डेवलपर्स भी गलती करते हैं। Senior डेवलपर्स कोड रिव्यू में दो मुख्य बातों पर ध्यान देते हैं: गलत एरर हैंडलिंग और सिंटैक्स का मिश्रण।
\n\nगलत उदाहरण (बिना catch के प्रॉमिस)
\nasync function loadData() {\n const response = await fetch('/api/data');\n const data = await response.json();\n return data;\n}सही तरीका
\nasync function loadData() {\n try {\n const response = await fetch('/api/data');\n if (!response.ok) {\n throw new Error(`HTTP error! status: ${response.status}`);\n }\n const data = await response.json();\n return data;\n } catch (error) {\n console.error('डेटा लोड करने में त्रुटि:', error);\n throw error; // ज़रूरत हो तो आगे भेजें\n }\n}महत्वपूर्ण: कभी भी एरर को इग्नोर न करें। खाली catch बुराई है। अगर एरर हुई, तो कम से कम उसे लॉग करें, और बेहतर होगा कि सही तरीके से हैंडल करें।
एक और आम गलती — await भूल जाना
\nfunction processUsers(users) {\n users.forEach(async (user) => {\n await updateUser(user); 
