एडिटर में सन्नाटा: TypeScript को ब्लॉक क्यों करें?
\n\nजिसने भी TypeScript में कम से कम एक हफ्ता कोड लिखा है, वह जानता है कि कंपाइलर कभी-कभी बिल्कुल सही कोड पर भी "चिल्लाने" लगता है। आपको यकीन है कि लॉजिक सही है, लेकिन tsc या IDE हर दूसरी लाइन को लाल कर देता है। खास तौर पर तब दर्द होता है जब यह एक ही ब्लॉक के अंदर हो: लूप, कंडीशन या फंक्शन।
सामान्य // @ts-ignore केवल अगली लाइन के लिए काम करता है। लेकिन अगर आपको कंपाइलर को 10-15 लाइनों के लिए "चुप" कराना हो तो? हर लाइन से पहले एक ही कमेंट कॉपी करना कोई हल नहीं है। इससे कोड गंदा होता है और पढ़ने लायक नहीं रहता।
इस लेख में हम तीन असली तरीके देखेंगे जिनसे TypeScript में पूरे ब्लॉक पर @ts-ignore लगाया जा सकता है। आप जानेंगे कि कब कौन सा तरीका सही है, और कब एरर को दबाना छोड़ देना चाहिए। चलिए शुरू करते हैं!
समस्या: @ts-ignore सिर्फ एक लाइन पर काम करता है
\n\nएक बुनियादी उदाहरण से शुरू करते हैं। मान लीजिए आप API से डायनामिक डेटा के साथ काम कर रहे हैं, जहां टाइप बदल सकते हैं। आपके पास कोड का एक ब्लॉक है जो पक्का चलेगा, लेकिन TypeScript हर प्रॉपर्टी एक्सेस पर गलती दिखाता है।
\n\n// उदाहरण: एक अविश्वसनीय API से रिस्पॉन्स पार्स करना\nconst data: any = { user: { name: 'Rahul', age: 25 } };\n\n// @ts-ignore\nconsole.log(data.user.name); // ठीक है, लेकिन सिर्फ एक लाइन\n\n// अगली लाइन फिर से एरर देगी, अगर // @ts-ignore न डालें\n// console.log(data.user.age); // Error: Property 'age' does not exist on type 'object'\n\n\nहर लाइन से पहले // @ts-ignore लिखना बुरी आदत है। इससे कोड बढ़ता है, रिफैक्टरिंग मुश्किल होती है, और असली एरर छिप जाती हैं। लेकिन अच्छी खबर यह है कि TypeScript (वर्जन 3.9 से) और कम्युनिटी ने कई स्मार्ट हल निकाले हैं।
तरीका 1: @ts-nocheck — पूरी फाइल के लिए जबरदस्ती
\n\nसबसे आसान, लेकिन सबसे कट्टर तरीका है फाइल की शुरुआत में // @ts-nocheck जोड़ना। यह पूरी फाइल के लिए टाइप चेकिंग बंद कर देता है। लेकिन हमें ब्लॉक चाहिए, पूरी फाइल नहीं। हालांकि, एक ट्रिक है: प्रॉब्लम ब्लॉक को अलग फाइल में डालकर इम्पोर्ट करें।
फायदे:
\n- \n
- तुरंत समस्या हल करता है। \n
- लेगसी कोड के लिए उपयुक्त जिसे बाद में फिर से लिखना है। \n
नुकसान:
\n- \n
- फाइल में सभी टाइप चेक बंद हो जाते हैं। असली बग छूट सकते हैं। \n
- सख्त लिंटिंग नियमों वाले बड़े प्रोजेक्ट्स के लिए उपयुक्त नहीं। \n
- कोड में "ब्लैक बॉक्स" बनाता है। \n
// bad.ts — बंद चेकिंग वाली फाइल\n// @ts-nocheck\nexport function processData(data: any) {\n const result = data.user.name + ' is ' + data.user.age;\n return result; // कोई एरर नहीं, भले ही data null हो\n}\n\n\nकब उपयोग करें: केवल अस्थायी स्क्रिप्ट्स या विरासत कोड के लिए जिसे आप फिर से लिख रहे हैं। प्रोडक्शन में बिना स्पष्ट TODO नोट के कभी उपयोग न करें।
तरीका 2: ts-expect-error — @ts-ignore का स्मार्ट विकल्प
\n\nTypeScript 3.9 से // @ts-expect-error डायरेक्टिव आई। यह लगभग @ts-ignore जैसा ही काम करता है, लेकिन एक बड़ा अंतर है: अगर एरर नहीं है, तो TypeScript चेतावनी देगा। इससे कमेंट हटाना नहीं भूलते।
लेकिन इसे ब्लॉक पर कैसे लगाएं? जवाब — सीधे तौर पर नहीं। @ts-expect-error भी सिर्फ एक लाइन पर काम करता है। हालांकि, हम IIFE (इमीडिएटली इनवोक्ड फंक्शन एक्सप्रेशन) का ट्रिक इस्तेमाल कर सकते हैं।
// ब्लॉक को IIFE में लपेटा गया है\n(function() {\n // @ts-expect-error — अगली लाइन में एरर की उम्मीद\n const x: number = 'नमस्ते'; // Error: Type 'string' is not assignable to type 'number'\n\n // @ts-expect-error — एक और उम्मीदित एरर\n con\n