TypeScript में कंडीशनल टाइप्स को मास्टर करें

अहा, TypeScript में कंडीशनल टाइप्स... ये गिरगिट की तरह हैं, आपके कोड की जरूरतों के अनुसार आकार बदलते और अनुकूल होते हैं! शायद आप बेसिक टाइप्स से पहले से परिचित हैं, लेकिन कंडीशनल टाइप्स इसे अगले स्तर पर ले जाते हैं। इन्हें स्मार्ट टाइप्स के रूप में सोचें जो परिस्थितियों के अनुसार ढलते हैं—जैसे टाइपिंग के सुपरहीरो। तो, आराम से बैठिए और अपने TypeScript कोड में कुछ जादू जोड़ने के लिए तैयार हो जाइए! 🧙‍♂️

कंडीशनल टाइप्स क्यों उपयोग करें? 🧐

TypeScript में, हमें पसंद है जब सब कुछ सुव्यवस्थित और कड़ाई से टाइप किया गया हो। लेकिन कभी-कभी, हमारे कोड को एक ऐसे टाइप की आवश्यकता होती है जो कुछ शर्तों के आधार पर अनुकूल हो। कल्पना कीजिए कि आपके पास एक फंक्शन है जो इनपुट पैरामीटर्स के आधार पर या तो string या number रिटर्न कर सकता है। 😱 कंडीशनल टाइप्स के बिना, आपको हर केस को मैन्युअली मैनेज करना होगा, और यह जल्दी ही थकाऊ हो जाता है! सौभाग्य से, कंडीशनल टाइप्स लचीलापन और प्रतिक्रियाशीलता लाते हैं, एक टाइपिंग निंजा की तरह। 🥷

बेसिक्स: कंडीशनल टाइप्स का सिंटैक्स 🧩

कंडीशनल टाइप्स कुछ हद तक टर्नरी ऑपरेटर की तरह हैं, लेकिन टाइप्स के लिए। यहाँ एक उदाहरण है जो आपको एक झलक देगा:

typescript
1type IsString<T> = T extends string
2 ? 'यह एक स्ट्रिंग है'
3 : 'यह स्ट्रिंग नहीं है';

इस उदाहरण में, IsString एक कंडीशनल टाइप है जो जाँचता है कि क्या T एक string है। यदि है, तो यह "यह एक स्ट्रिंग है" रिटर्न करता है, अन्यथा "यह स्ट्रिंग नहीं है"। काफी सरल है, लेकिन प्रतीक्षा करें जब तक आप नहीं देखते कि हम अधिक उन्नत मामलों में क्या कर सकते हैं!

व्यावहारिक उदाहरण: कॉन्फ़िगरेशन के आधार पर टाइप को अनुकूलित करना 🛠️

कल्पना कीजिए एक फंक्शन जो एक कॉन्फ़िगरेशन पैरामीटर लेता है और उस कॉन्फ़िगरेशन के आधार पर एक अलग टाइप रिटर्न करना चाहिए। कंडीशनल टाइप्स इस तरह के जादू के लिए एकदम सही हैं ✨!

कोड उदाहरण

typescript
1type Config = {
2 mode: 'simple' | 'detailed';
3};
4
5type Response<T extends Config> = T['mode'] extends 'simple'
6 ? { data: string }
7 : { data: string; details: string[] };
8
9function fetchData<T extends Config>(config: T): Response<T> {
10 if (config.mode === 'simple') {
11 return { data: 'सरलीकृत डेटा' } as Response<T>;
12 } else {
13 return {
14 data: 'पूर्ण डेटा',
15 details: ['विवरण1', 'विवरण2'],
16 } as Response<T>;
17 }
18}
19
20const simpleConfig = { mode: 'simple' };
21const detailedConfig = { mode: 'detailed' };
22
23const resultSimple = fetchData(simpleConfig); // { data: "सरलीकृत डेटा" }
24const resultDetailed = fetchData(detailedConfig); // { data: "पूर्ण डेटा", details: [...] }

इस उदाहरण में, Response<T> टाइप को mode के "simple" या "detailed" होने के आधार पर अनुकूलित करता है। जादू होता है: fetchData(simpleConfig) केवल data के साथ एक ऑब्जेक्ट रिटर्न करता है, जबकि fetchData(detailedConfig) में details भी शामिल है। सुविधाजनक, है ना?

नेस्टेड कंडीशनल टाइप्स: टाइपिंग à la Carte 🧇

यहीं क्यों रुकें? आप और भी सटीक मामलों को संभालने के लिए कंडीशनल टाइप्स को नेस्ट भी कर सकते हैं! कल्पना कीजिए कि आप टाइप को न केवल mode के आधार पर बल्कि इस बात पर भी अनुकूलित करना चाहते हैं कि उपयोगकर्ता प्रमाणित है या नहीं। कुछ एडवांस्ड टाइप जगलिंग के लिए तैयार हैं? 🎢

typescript
1type UserResponse<
2 T extends Config,
3 Authenticated extends boolean,
4> = Authenticated extends true
5 ? T['mode'] extends 'simple'
6 ? { data: string }
7 : { data: string; details: string[] }
8 : { error: 'प्रमाणित नहीं है' };
9
10function fetchUserData<T extends Config, Authenticated extends boolean>(
11 config: T,
12 isAuthenticated: Authenticated,
13): UserResponse<T, Authenticated> {
14 if (!isAuthenticated) {
15 return { error: 'प्रमाणित नहीं है' } as UserResponse<T, Authenticated>;
16 }
17 if (config.mode === 'simple') {
18 return { data: 'सरलीकृत डेटा' } as UserResponse<T, Authenticated>;
19 } else {
20 return {
21 data: 'पूर्ण डेटा',
22 details: ['विवरण1', 'विवरण2'],
23 } as UserResponse<T, Authenticated>;
24 }
25}
26
27const resultAuthSimple = fetchUserData(simpleConfig, true);
28const resultAuthDetailed = fetchUserData(detailedConfig, true);
29const resultNotAuth = fetchUserData(detailedConfig, false);

यहाँ, UserResponse दो मानदंडों के आधार पर टाइप को अनुकूलित करता है: mode और isAuthenticated। परिणाम? अल्ट्रा-सटीक टाइपिंग जो सभी संभावित मामलों को कवर करती है!

infer के साथ एडवांस्ड कंडीशनल टाइप्स: टाइप डिडक्शन 🕵️‍♂️

कुछ एडवांस्ड ट्रिक्स के लिए तैयार हैं? TypeScript में कंडीशनल टाइप्स के लिए एक विशेष कीवर्ड है: infer। यह आपको अपने कंडीशनल टाइप में सीधे एक टाइप का अनुमान लगाने की अनुमति देता है। जटिल टाइप्स से जानकारी निकालने के लिए उपयोगी!

infer के साथ उदाहरण

typescript
1type ReturnTypeOfFunction<T> = T extends (...args: any[]) => infer R
2 ? R
3 : never;
4
5function getHello(): string {
6 return 'नमस्ते, दुनिया!';
7}
8
9type HelloReturnType = ReturnTypeOfFunction<typeof getHello>; // परिणाम: string

यहाँ, ReturnTypeOfFunction एक फंक्शन के रिटर्न टाइप का अनुमान लगाने के लिए infer R का उपयोग करता है। इस उदाहरण में, HelloReturnType टाइप string होगा क्योंकि getHello एक स्ट्रिंग रिटर्न करता है।

निष्कर्ष 🎉

TypeScript में कंडीशनल टाइप्स आपके कोड के लिए सुपरपावर्स की तरह हैं। वे आपको डायनामिक टाइप्स बनाने और आपके कोड को सरल बनाते हुए कड़ी टाइपिंग बनाए रखने की अनुमति देते हैं। अपने सहयोगियों को प्रभावित करने के लिए तैयार हैं? इन कंडीशनल टाइप्स के साथ प्रयोग करें और अपने TypeScript कोड को संरचित करने के नए तरीके खोजें! 🚀

अब लगभग टाइप्स के लिए कोई बहाना नहीं—कंडीशनल टाइप्स के साथ, आपका TypeScript कोड लगभग बुलेटप्रूफ बन जाता है! 👌

इस लेख को साझा करें


Sébastien Timoner

Sébastien TIMONER

लीड डेवलपर
कस्टम डेवलपमेंट विशेषज्ञ
Aix-en-Provence, France

वेब विकास और तकनीकी टीम प्रबंधन में विशेषज्ञ, मैं प्रभावी डिजिटल समाधानों के निर्माण और अनुकूलन में विशेषज्ञता रखता हूं। React.js, Node.js, TypeScript और Symfony जैसी आधुनिक तकनीकों की गहरी समझ के साथ, मैं offroadLabs में विभिन्न क्षेत्रों की कंपनियों के लिए जटिल SaaS परियोजनाओं की सफलता सुनिश्चित करता हूं, डिजाइन से लेकर प्रोडक्शन तक।

offroadLabs में, मैं तकनीकी विशेषज्ञता और सहयोगात्मक दृष्टिकोण को जोड़ते हुए कस्टम विकास सेवाएं प्रदान करता हूं। चाहे एक नवीन SaaS समाधान बनाना हो, मौजूदा एप्लिकेशन को आधुनिक बनाना हो, या एक टीम के कौशल विकास में सहायता करना हो, मैं प्रत्येक परियोजना की विशिष्ट आवश्यकताओं के अनुरूप मजबूत और प्रभावी समाधान प्रदान करने के लिए प्रतिबद्ध हूं।

मैं ऐक्स-एन-प्रोवेंस के आसपास या पूर्ण रिमोट असाइनमेंट के लिए उपलब्ध हूं।