TypeScript में Record क्या है? शुरुआती गाइड और उदाहरण

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

TypeScript में Record: प्रैक्टिकल तरीके से समझें

\n\n

कल्पना करें कि आप अंग्रेजी शब्द सीखने का एक ऐप बना रहे हैं। आपको अनुवाद स्टोर करने हैं: cat → बिल्ली, dog → कुत्ता। TypeScript में इसे सही तरीके से टाइप कैसे करें? आप एक इंटरफ़ेस बना सकते हैं, लेकिन क्या होगा अगर कीज़ पहले से पता न हों? या बहुत सारी हों? ऐसे में Record काम आता है — यह सबसे उपयोगी लेकिन अक्सर अनदेखा किया जाने वाला यूटिलिटी टाइप है।

\n\n

इस लेख में हम TypeScript में Record टाइप को रियल उदाहरणों के साथ समझेंगे, जिन्हें आप तुरंत अपने प्रोजेक्ट में लगा सकते हैं। कोई बोरिंग थ्योरी नहीं — सिर्फ प्रैक्टिस।

\n\n

TypeScript में Record क्या है? सरल शब्दों में

\n\n

Record<K, V> एक बिल्ट-इन यूटिलिटी टाइप है जो एक ऑब्जेक्ट बनाता है, जहाँ सभी कीज़ का टाइप K और सभी वैल्यू का टाइप V होता है।
इसे एक टाइप किया हुआ डिक्शनरी या फिक्स्ड कीज़ वाला मैप समझें।

\n\n

बेसिक सिंटैक्स इस तरह है:

\n\n
// सामान्य ऑब्जेक्ट\nconst userRoles: Record<string, string> = {\n  admin: 'एडमिन',\n  user: 'यूज़र',\n  guest: 'मेहमान'\n};
\n\n

यहाँ Record<string, string> का मतलब है: "एक ऑब्जेक्ट जहाँ कीज़ स्ट्रिंग हैं और वैल्यू भी स्ट्रिंग हैं"। सरल और स्पष्ट।

\n\n

Record सामान्य इंटरफ़ेस से बेहतर क्यों है?

\n\n
    \n
  • कीज़ में लचीलापन: आप union-टाइप के ज़रिए कीज़ का एक खास सेट दे सकते हैं।
  • \n
  • संक्षिप्तता: हर फील्ड को मैन्युअल रूप से लिखने की ज़रूरत नहीं।
  • \n
  • सुरक्षा: TypeScript चेक करेगा कि आप केवल अनुमत कीज़ का ही उपयोग कर रहे हैं।
  • \n
\n\n

Record vs सामान्य ऑब्जेक्ट: एक उदाहरण

\n\n

मान लीजिए, हमारे पास ऑर्डर के स्टेटस हैं: pending, shipped, delivered। Record के बिना, हमें तीन फील्ड वाला इंटरफ़ेस लिखना होगा:

\n\n
interface OrderStatusMap {\n  pending: string;\n  shipped: string;\n  delivered: string;\n}\n\nconst statusDescriptions: OrderStatusMap = {\n  pending: 'प्रोसेस हो रहा है',\n  shipped: 'भेज दिया गया',\n  delivered: 'डिलीवर हो गया'\n};
\n\n

जबकि Record के साथ यह ज़्यादा कॉम्पैक्ट और साफ है:

\n\n
type OrderStatus = 'pending' | 'shipped' | 'delivered';\n\nconst statusDescriptions: Record<OrderStatus, string> = {\n  pending: 'प्रोसेस हो रहा है',\n  shipped: 'भेज दिया गया',\n  delivered: 'डिलीवर हो गया'\n};
\n\n

फायदा: अगर आप ऑब्जेक्ट में cancelled जोड़ने की कोशिश करेंगे, तो TypeScript तुरंत एरर दिखाएगा — यह स्टेटस union-टाइप में नहीं है।

\n\n

Record के टॉप-5 प्रैक्टिकल उदाहरण

\n\n

आइए देखें कि Record वास्तव में कहाँ काम आता है।

\n\n

1. ऐप कॉन्फ़िगरेशन

\n

ज्ञात कीज़ के साथ सेटिंग्स स्टोर करें, लेकिन अलग-अलग टाइप की वैल्यू:

\n\n
type ConfigKeys = 'apiUrl' | 'timeout' | 'retryCount';\ntype ConfigValue = string | number | boolean;\n\nconst appConfig: Record<ConfigKeys, ConfigValue> = {\n  apiUrl: 'https://api.example.com',\n  timeout: 5000,\n  retryCount: 3\n};
\n\n

2. Enum या कॉन्स्टेंट का मैपिंग

\n

अक्सर कोड और उसके मानव-पठनीय नाम को जोड़ना होता है:

\n\n
enum HttpStatus {\n  OK = 200,\n  NotFound = 404,\n  Error = 500\n}\n\nconst statusMessages: Record<HttpStatus, string> = {\n  [HttpStatus.OK]: 'सब ठीक है',\n  [HttpStatus.NotFound]: 'नहीं मिला',\n  [HttpStatus.Error]: 'सर्वर एरर'\n};
\n\n

3. फॉर्म और वैलिडेशन

\n

Record फील्ड-वार वैलिडेशन एरर स्टोर करने के लिए बहुत अच्छा है:

\n\n
type FormFields = 'email' | 'password' | 'name';\ntype ValidationErrors = Record<FormFields, string | null>;\n\nconst errors: ValidationErrors = {\n  email: 'गलत ईमेल',\n  password: null,\n  name: 'नाम ज़रूरी है'\n};
\n\n

4. डेटा कैश

\n

आइडेंटिफ़ायर कीज़ के साथ कैश का अनुकरण:

\n\n
type UserI                

ब्लॉग

पुस्तक अनुशंसाएँ