अधिक अभिव्यंजक और रखरखाव योग्य कोड लिखने के लिए टेम्पलेट लिटरल टाइप्स और कंडीशनल टाइप्स जैसी उन्नत टाइपस्क्रिप्ट सुविधाओं का अन्वेषण करें। जटिल परिदृश्यों के लिए टाइप मैनिपुलेशन में महारत हासिल करें।
टाइपस्क्रिप्ट एडवांस्ड टाइप्स: टेम्पलेट लिटरल और कंडीशनल टाइप्स में महारत हासिल करना
टाइपस्क्रिप्ट की ताकत इसके शक्तिशाली टाइप सिस्टम में निहित है। जबकि string, number, और boolean जैसे बुनियादी टाइप कई परिदृश्यों के लिए पर्याप्त हैं, टेम्पलेट लिटरल टाइप्स और कंडीशनल टाइप्स जैसी उन्नत सुविधाएँ अभिव्यंजकता और टाइप सुरक्षा के एक नए स्तर को खोलती हैं। यह गाइड इन उन्नत टाइप्स का एक व्यापक अवलोकन प्रदान करती है, उनकी क्षमताओं की खोज करती है और व्यावहारिक अनुप्रयोगों का प्रदर्शन करती है।
टेम्पलेट लिटरल टाइप्स को समझना
टेम्पलेट लिटरल टाइप्स जावास्क्रिप्ट के टेम्पलेट लिटरल पर आधारित होते हैं, जो आपको स्ट्रिंग इंटरपोलेशन के आधार पर टाइप्स को परिभाषित करने की अनुमति देते हैं। यह विशिष्ट स्ट्रिंग पैटर्न का प्रतिनिधित्व करने वाले टाइप्स के निर्माण को सक्षम बनाता है, जिससे आपका कोड अधिक मजबूत और पूर्वानुमानित हो जाता है।
बुनियादी सिंटैक्स और उपयोग
टेम्पलेट लिटरल टाइप्स टाइप परिभाषा को संलग्न करने के लिए बैकटिक्स (`) का उपयोग करते हैं, जो जावास्क्रिप्ट टेम्पलेट लिटरल के समान है। बैकटिक्स के भीतर, आप ${} सिंटैक्स का उपयोग करके अन्य टाइप्स को इंटरपोलेट कर सकते हैं। यहीं पर जादू होता है - आप अनिवार्य रूप से एक ऐसा टाइप बना रहे हैं जो एक स्ट्रिंग है, जिसे इंटरपोलेशन के अंदर के टाइप्स के आधार पर कंपाइल समय पर बनाया गया है।
type HTTPMethod = "GET" | "POST" | "PUT" | "DELETE";
type APIEndpoint = `/api/${string}`;
// उदाहरण उपयोग
const getEndpoint: APIEndpoint = "/api/users"; // मान्य
const postEndpoint: APIEndpoint = "/api/products/123"; // मान्य
const invalidEndpoint: APIEndpoint = "/admin/settings"; // टाइपस्क्रिप्ट यहाँ कोई त्रुटि नहीं दिखाएगा क्योंकि `string` कुछ भी हो सकता है
इस उदाहरण में, APIEndpoint एक ऐसा टाइप है जो /api/ से शुरू होने वाले किसी भी स्ट्रिंग का प्रतिनिधित्व करता है। जबकि यह बुनियादी उदाहरण उपयोगी है, टेम्पलेट लिटरल टाइप्स की असली शक्ति तब उभरती है जब इसे अधिक विशिष्ट टाइप बाधाओं के साथ जोड़ा जाता है।
यूनियन टाइप्स के साथ संयोजन
टेम्पलेट लिटरल टाइप्स यूनियन टाइप्स के साथ उपयोग किए जाने पर वास्तव में चमकते हैं। यह आपको ऐसे टाइप्स बनाने की अनुमति देता है जो स्ट्रिंग संयोजनों के एक विशिष्ट सेट का प्रतिनिधित्व करते हैं।
type HTTPMethod = "GET" | "POST" | "PUT" | "DELETE";
type APIPath = "users" | "products" | "orders";
type APIEndpoint = `/${APIPath}/${HTTPMethod}`;
// मान्य API एंडपॉइंट्स
const getUsers: APIEndpoint = "/users/GET";
const postProducts: APIEndpoint = "/products/POST";
// अमान्य API एंडपॉइंट्स (टाइपस्क्रिप्ट त्रुटियों का कारण बनेंगे)
// const invalidEndpoint: APIEndpoint = "/users/PATCH"; // त्रुटि: "/users/PATCH" को टाइप "/users/GET" | "/users/POST" | "/users/PUT" | "/users/DELETE" | "/products/GET" | "/products/POST" | ... 3 और ... | "/orders/DELETE" को असाइन नहीं किया जा सकता।
अब, APIEndpoint एक अधिक प्रतिबंधात्मक टाइप है जो केवल API पाथ और HTTP मेथड के विशिष्ट संयोजनों की अनुमति देता है। टाइपस्क्रिप्ट अमान्य संयोजनों का उपयोग करने के किसी भी प्रयास को फ़्लैग करेगा, जिससे टाइप सुरक्षा बढ़ेगी।
टेम्पलेट लिटरल टाइप्स के साथ स्ट्रिंग मैनिपुलेशन
टाइपस्क्रिप्ट आंतरिक स्ट्रिंग मैनिपुलेशन टाइप्स प्रदान करता है जो टेम्पलेट लिटरल टाइप्स के साथ सहजता से काम करते हैं। ये टाइप्स आपको कंपाइल समय पर स्ट्रिंग्स को बदलने की अनुमति देते हैं।
- Uppercase: एक स्ट्रिंग को अपरकेस में बदलता है।
- Lowercase: एक स्ट्रिंग को लोअरकेस में बदलता है।
- Capitalize: एक स्ट्रिंग के पहले अक्षर को कैपिटलाइज़ करता है।
- Uncapitalize: एक स्ट्रिंग के पहले अक्षर को अनकैपिटलाइज़ करता है।
type Greeting = "hello world";
type UppercaseGreeting = Uppercase; // "HELLO WORLD"
type LowercaseGreeting = Lowercase; // "hello world"
type CapitalizedGreeting = Capitalize; // "Hello world"
type UncapitalizedGreeting = Uncapitalize; // "hello world"
ये स्ट्रिंग मैनिपुलेशन टाइप्स नामकरण परंपराओं के आधार पर स्वचालित रूप से टाइप्स उत्पन्न करने के लिए विशेष रूप से उपयोगी हैं। उदाहरण के लिए, आप इवेंट नामों से एक्शन टाइप प्राप्त कर सकते हैं या इसके विपरीत।
टेम्पलेट लिटरल टाइप्स के व्यावहारिक अनुप्रयोग
- API एंडपॉइंट परिभाषा: जैसा कि ऊपर दिखाया गया है, सटीक टाइप बाधाओं के साथ API एंडपॉइंट्स को परिभाषित करना।
- इवेंट हैंडलिंग: विशिष्ट उपसर्गों और प्रत्ययों के साथ इवेंट नामों के लिए टाइप्स बनाना।
- CSS क्लास जनरेशन: कंपोनेंट नामों और स्टेट्स के आधार पर CSS क्लास नाम उत्पन्न करना।
- डेटाबेस क्वेरी बिल्डिंग: डेटाबेस क्वेरी बनाते समय टाइप सेफ्टी सुनिश्चित करना।
अंतर्राष्ट्रीय उदाहरण: मुद्रा स्वरूपण
एक वित्तीय एप्लिकेशन बनाने की कल्पना करें जो कई मुद्राओं का समर्थन करता है। आप सही मुद्रा स्वरूपण को लागू करने के लिए टेम्पलेट लिटरल टाइप्स का उपयोग कर सकते हैं।
type CurrencyCode = "USD" | "EUR" | "GBP" | "JPY";
type CurrencyFormat = `${number} ${T}`;
const priceUSD: CurrencyFormat<"USD"> = "100 USD"; // मान्य
const priceEUR: CurrencyFormat<"EUR"> = "50 EUR"; // मान्य
// const priceInvalid: CurrencyFormat<"USD"> = "100 EUR"; // त्रुटि: टाइप 'string' को टाइप '`${number} USD`' को असाइन नहीं किया जा सकता।
function formatCurrency(amount: number, currency: T): CurrencyFormat {
return `${amount} ${currency}`;
}
const formattedUSD = formatCurrency(250, "USD"); // टाइप: "250 USD"
const formattedEUR = formatCurrency(100, "EUR"); // टाइप: "100 EUR"
यह उदाहरण सुनिश्चित करता है कि मुद्रा मान हमेशा सही मुद्रा कोड के साथ स्वरूपित होते हैं, जिससे संभावित त्रुटियों को रोका जा सकता है।
कंडीशनल टाइप्स में गहराई से उतरना
कंडीशनल टाइप्स टाइपस्क्रिप्ट के टाइप सिस्टम में ब्रांचिंग लॉजिक का परिचय देते हैं, जिससे आप ऐसे टाइप्स को परिभाषित कर सकते हैं जो अन्य टाइप्स पर निर्भर करते हैं। यह सुविधा अत्यधिक लचीली और पुन: प्रयोज्य टाइप परिभाषाएँ बनाने के लिए अविश्वसनीय रूप से शक्तिशाली है।
बुनियादी सिंटैक्स और उपयोग
कंडीशनल टाइप्स टाइप शर्तों को परिभाषित करने के लिए infer कीवर्ड और टर्नरी ऑपरेटर (condition ? trueType : falseType) का उपयोग करते हैं।
type IsString = T extends string ? true : false;
type StringCheck = IsString; // type StringCheck = true
type NumberCheck = IsString; // type NumberCheck = false
इस उदाहरण में, IsString एक कंडीशनल टाइप है जो जांचता है कि क्या T string को असाइन किया जा सकता है। यदि ऐसा है, तो टाइप true में हल हो जाता है; अन्यथा, यह false में हल हो जाता है।
infer कीवर्ड
infer कीवर्ड आपको एक टाइप से दूसरे टाइप को निकालने की अनुमति देता है। यह विशेष रूप से जटिल टाइप्स जैसे फ़ंक्शन टाइप्स या ऐरे टाइप्स के साथ काम करते समय उपयोगी होता है।
type ReturnType any> = T extends (...args: any) => infer R ? R : any;
function add(a: number, b: number): number {
return a + b;
}
type AddReturnType = ReturnType; // type AddReturnType = number
इस उदाहरण में, ReturnType एक फ़ंक्शन टाइप T का रिटर्न टाइप निकालता है। कंडीशनल टाइप का infer R हिस्सा रिटर्न टाइप का अनुमान लगाता है और इसे टाइप वेरिएबल R को असाइन करता है। यदि T एक फ़ंक्शन टाइप नहीं है, तो टाइप any में हल हो जाता है।
डिस्ट्रिब्यूटिव कंडीशनल टाइप्स
कंडीशनल टाइप्स तब डिस्ट्रिब्यूटिव हो जाते हैं जब चेक किया गया टाइप एक नेकेड टाइप पैरामीटर होता है। इसका मतलब है कि कंडीशनल टाइप को यूनियन टाइप के प्रत्येक सदस्य पर अलग-अलग लागू किया जाता है।
type ToArray = T extends any ? T[] : never;
type NumberOrStringArray = ToArray; // type NumberOrStringArray = string[] | number[]
इस उदाहरण में, ToArray एक टाइप T को एक ऐरे टाइप में परिवर्तित करता है। क्योंकि T एक नेकेड टाइप पैरामीटर है (किसी अन्य टाइप में लिपटा नहीं है), कंडीशनल टाइप number और string पर अलग-अलग लागू होता है, जिसके परिणामस्वरूप number[] और string[] का एक यूनियन बनता है।
कंडीशनल टाइप्स के व्यावहारिक अनुप्रयोग
- रिटर्न टाइप्स निकालना: जैसा कि ऊपर दिखाया गया है, किसी फ़ंक्शन का रिटर्न टाइप निकालना।
- एक यूनियन से टाइप्स को फ़िल्टर करना: एक ऐसा टाइप बनाना जिसमें यूनियन से केवल विशिष्ट टाइप्स शामिल हों।
- ओवरलोडेड फ़ंक्शन टाइप्स को परिभाषित करना: इनपुट टाइप्स के आधार पर अलग-अलग फ़ंक्शन टाइप्स बनाना।
- टाइप गार्ड्स बनाना: ऐसे फ़ंक्शन को परिभाषित करना जो एक वेरिएबल के टाइप को संकुचित करते हैं।
अंतर्राष्ट्रीय उदाहरण: विभिन्न दिनांक प्रारूपों को संभालना
दुनिया के विभिन्न क्षेत्र अलग-अलग दिनांक प्रारूपों का उपयोग करते हैं। आप इन विविधताओं को संभालने के लिए कंडीशनल टाइप्स का उपयोग कर सकते हैं।
type DateFormat = "YYYY-MM-DD" | "MM/DD/YYYY" | "DD.MM.YYYY";
type ParseDate = T extends "YYYY-MM-DD"
? { year: number; month: number; day: number; format: "YYYY-MM-DD" }
: T extends "MM/DD/YYYY"
? { month: number; day: number; year: number; format: "MM/DD/YYYY" }
: T extends "DD.MM.YYYY"
? { day: number; month: number; year: number; format: "DD.MM.YYYY" }
: never;
function parseDate(dateString: string, format: T): ParseDate {
// (कार्यान्वयन विभिन्न दिनांक प्रारूपों को संभालेगा)
if (format === "YYYY-MM-DD") {
const [year, month, day] = dateString.split("-").map(Number);
return { year, month, day, format } as ParseDate;
} else if (format === "MM/DD/YYYY") {
const [month, day, year] = dateString.split("/").map(Number);
return { month, day, year, format } as ParseDate;
} else if (format === "DD.MM.YYYY") {
const [day, month, year] = dateString.split(".").map(Number);
return { day, month, year, format } as ParseDate;
} else {
throw new Error("Invalid date format");
}
}
const parsedDateISO = parseDate("2023-10-27", "YYYY-MM-DD"); // टाइप: { year: number; month: number; day: number; format: "YYYY-MM-DD"; }
const parsedDateUS = parseDate("10/27/2023", "MM/DD/YYYY"); // टाइप: { month: number; day: number; year: number; format: "MM/DD/YYYY"; }
const parsedDateEU = parseDate("27.10.2023", "DD.MM.YYYY"); // टाइप: { day: number; month: number; year: number; format: "DD.MM.YYYY"; }
console.log(parsedDateISO.year); // यह जानते हुए कि यह वहाँ होगा, वर्ष तक पहुँचें
यह उदाहरण निर्दिष्ट दिनांक प्रारूप के आधार पर विभिन्न दिनांक पार्सिंग फ़ंक्शन को परिभाषित करने के लिए कंडीशनल टाइप्स का उपयोग करता है। ParseDate टाइप यह सुनिश्चित करता है कि लौटाए गए ऑब्जेक्ट में प्रारूप के आधार पर सही गुण हों।
टेम्पलेट लिटरल और कंडीशनल टाइप्स का संयोजन
असली शक्ति तब आती है जब आप टेम्पलेट लिटरल टाइप्स और कंडीशनल टाइप्स को मिलाते हैं। यह अविश्वसनीय रूप से शक्तिशाली टाइप मैनिपुलेशन की अनुमति देता है।
type EventName = `on${Capitalize}`;
type ExtractEventPayload = T extends EventName
? { type: T; payload: any } // प्रदर्शन के लिए सरलीकृत
: never;
type ClickEvent = EventName<"click">; // "onClick"
type MouseOverEvent = EventName<"mouseOver">; // "onMouseOver"
//उदाहरण फ़ंक्शन जो एक टाइप लेता है
function processEvent(event: T): ExtractEventPayload {
//एक वास्तविक कार्यान्वयन में, हम वास्तव में इवेंट को डिस्पैच करेंगे।
console.log(`Processing event ${event}`);
//एक वास्तविक कार्यान्वयन में, पेलोड इवेंट टाइप पर आधारित होगा।
return { type: event, payload: {} } as ExtractEventPayload;
}
//ध्यान दें कि रिटर्न टाइप्स बहुत विशिष्ट हैं:
const clickEvent = processEvent("onClick"); // { type: "onClick"; payload: any; }
const mouseOverEvent = processEvent("onMouseOver"); // { type: "onMouseOver"; payload: any; }
//यदि आप अन्य स्ट्रिंग्स का उपयोग करते हैं, तो आपको never मिलता है:
// const someOtherEvent = processEvent("someOtherEvent"); // टाइप `never` है
सर्वश्रेष्ठ अभ्यास और विचार
- इसे सरल रखें: शक्तिशाली होते हुए भी, ये उन्नत टाइप्स जल्दी जटिल हो सकते हैं। स्पष्टता और रखरखाव के लिए प्रयास करें।
- पूरी तरह से परीक्षण करें: यह सुनिश्चित करने के लिए कि आपकी टाइप परिभाषाएँ अपेक्षा के अनुरूप व्यवहार करती हैं, व्यापक यूनिट टेस्ट लिखें।
- अपने कोड का दस्तावेजीकरण करें: कोड पठनीयता में सुधार के लिए अपने उन्नत टाइप्स के उद्देश्य और व्यवहार का स्पष्ट रूप से दस्तावेजीकरण करें।
- प्रदर्शन पर विचार करें: उन्नत टाइप्स का अत्यधिक उपयोग संकलन समय को प्रभावित कर सकता है। अपने कोड का प्रोफाइल करें और जहां आवश्यक हो वहां अनुकूलन करें।
निष्कर्ष
टेम्पलेट लिटरल टाइप्स और कंडीशनल टाइप्स टाइपस्क्रिप्ट के शस्त्रागार में शक्तिशाली उपकरण हैं। इन उन्नत टाइप्स में महारत हासिल करके, आप अधिक अभिव्यंजक, रखरखाव योग्य और टाइप-सेफ कोड लिख सकते हैं। ये सुविधाएँ आपको टाइप्स के बीच जटिल संबंधों को पकड़ने, सख्त बाधाओं को लागू करने और अत्यधिक पुन: प्रयोज्य टाइप परिभाषाएँ बनाने में सक्षम बनाती हैं। अपने टाइपस्क्रिप्ट कौशल को बढ़ाने और वैश्विक दर्शकों के लिए मजबूत और स्केलेबल एप्लिकेशन बनाने के लिए इन तकनीकों को अपनाएं।