शुरुआती TypeScript डेवलपर्स की शीर्ष गलतियाँ: A से Z तक

शुरुआती TypeScript डेवलपर्स की शीर्ष गलतियाँ: A से Z तक

TypeScript एक शक्तिशाली उपकरण है जो JavaScript में स्थैतिक टाइपिंग जोड़ता है, जिससे कोड अधिक पूर्वानुमानित और सुरक्षित हो जाता है। हालाँकि, JS से TS में संक्रमण अक्सर सामान्य गलतियों के साथ होता है जो सख्त टाइपिंग के सभी लाभों को समाप्त कर सकती हैं। इस लेख में, हम शुरुआती TypeScript डेवलपर्स की सबसे आम गलतियों का विश्लेषण करेंगे - any के दुरुपयोग से लेकर null और undefined के साथ गलत काम करने तक। आप सीखेंगे कि उनसे कैसे बचें और स्वच्छ, विश्वसनीय कोड कैसे लिखें।

1. any प्रकार का दुरुपयोग

शुरुआती लोगों की सबसे आम गलती हर जगह any का उपयोग करना है जहाँ "सोचने का मन नहीं करता"। TypeScript प्रकारों के लिए बनाया गया है, और any जाँच को पूरी तरह से बंद कर देता है।

// ❌ बुराfunction processData(data: any) {  return data.length; // रनटाइम में त्रुटि, यदि data एक संख्या है}

// ✅ अच्छाfunction processData(data: string | unknown[]) {  return data.length; // TypeScript जाँच करेगा कि data में length है}

सुझाव: यदि प्रकार वास्तव में अज्ञात है तो any के बजाय unknown का उपयोग करें। हमेशा विशिष्ट प्रकारों के लिए प्रयास करें।

2. strictNullChecks को अनदेखा करना

डिफ़ॉल्ट रूप से strictNullChecks चालू होता है, लेकिन कई शुरुआती इसे "सरलता के लिए" बंद कर देते हैं। इससे रनटाइम त्रुटियाँ होती हैं।

// ❌ बुरा (यदि strictNullChecks: false)let name: string = null; // काम करता है, लेकिन बाद में त्रुटि उत्पन्न करेगा

// ✅ अच्छाlet name: string | null = null; // स्पष्ट रूप से null की संभावना बताएंif (name !== null) {  console.log(name.toUpperCase());}

सुझाव: strictNullChecks को कभी बंद न करें। null/undefined के साथ सुरक्षित रूप से काम करने के लिए Optional Chaining (?.) और Nullish Coalescing (??) का उपयोग करें।

3. ऐरे प्रकारों का गलत उपयोग

Array<T> और T[] के बीच भ्रम सामान्य है, लेकिन मुख्य गलती तत्वों के प्रकार को निर्दिष्ट न करना है।

// ❌ बुराlet items = []; // प्रकार any[]items.push(1);items.push("hello"); // काम करता है, लेकिन नियंत्रण खो देते हैं

// ✅ अच्छाlet items: number[] = []; // केवल संख्याएँlet strings: Array<string> = []; // वैकल्पिक लेखन

सुझाव: हमेशा ऐरे के प्रकार को एनोटेट करें, खासकर यदि यह घोषणा के समय खाली है। अपरिवर्तनीयता के लिए readonly का उपयोग करें।

4. फ़ंक्शन और कॉलबैक की गलत टाइपिंग

शुरुआती अक्सर फ़ंक्शन पैरामीटर को टाइप करना भूल जाते हैं या Function को प्रकार के रूप में उपयोग करते हैं।

// ❌ बुराfunction fetchData(callback: Function) {  callback("data", 123);}fetchData((err: string, data: number) => {}); // त्रुटि: 2 तर्कों की अपेक्षा है

// ✅ अच्छाfunction fetchData(callback: (err: string | null, data: number) => void) {  callback(null, 123);}

सुझाव: पैरामीटर और रिटर्न वैल्यू को स्पष्ट रूप से टाइप करें। कॉलबैक के लिए एरो प्रकार या type/interface का उपयोग करें।

5. interface और type के बीच भ्रम

कई लोग अंतर नहीं समझते और उन्हें परस्पर विनिमय योग्य के रूप में उपयोग करते हैं, जिससे त्रुटियाँ हो सकती हैं।

// interface — को जोड़ा जा सकता है (declaration merging)interface User {  name: string;}interface User {  age: number;} // काम करता है

// type — को जोड़ा नहीं जा सकता, लेकिन union/intersection बनाया जा सकता हैtype Status = "active" | "inactive";type Admin = User & { role: "admin" };

सुझाव: उन ऑब्जेक्ट्स के लिए interface का उपयोग करें जो विस्तारित हो सकते हैं (उदाहरण के लिए, लाइब्रेरी में)। union-प्रकार, tuples और जटिल रचनाओं के लिए type का उपयोग करें।

6. readonly और const को अनदेखा करना