शाब्दिक प्रकार और दावे

टाइपस्क्रिप्ट वेरिएबल्स के संभावित मूल्यों को कम करने और आवश्यक होने पर कंपाइलर को अधिक विशिष्ट प्रकारों को पहचानने के लिए मजबूर करने के लिए उन्नत उपकरण प्रदान करता है।

शाब्दिक प्रकार

एक शाब्दिक प्रकार एक सटीक, एकल मान (उदाहरण के लिए, एक विशिष्ट स्ट्रिंग या संख्या) का प्रतिनिधित्व करता है। वे आम तौर पर संघ प्रकारों के साथ संयुक्त होते हैं:

type TrafficLight = 'red' | 'yellow' | 'green';
let light: TrafficLight;

light = 'red'; // OK
light = 'blue'; // Error: "blue" is not assignable to TrafficLight

अभिकथन टाइप करें (as)

कभी-कभी आपके पास ऐसे प्रकार के बारे में जानकारी होती है जिसे टाइपस्क्रिप्ट संकलन समय पर नहीं जान सकता है। इन मामलों में, आप as कीवर्ड का उपयोग करके प्रकार के दावे का उपयोग कर सकते हैं:

const myCanvas = document.getElementById('main_canvas') as HTMLCanvasElement;

दावा संकलक को बताता है: "मुझ पर भरोसा करें, मुझे पता है कि यह तत्व एक HTMLCanvasElement है"। यह रनटाइम पर कोई जाँच या कास्ट नहीं करता है; यह केवल टाइप चेकर की मदद करता है।

स्थिर अभिकथन (as const)

जब हम किसी ऑब्जेक्ट या ऐरे को const के साथ घोषित करते हैं, तो टाइपस्क्रिप्ट अभी भी इसके आंतरिक गुणों को संशोधित करने की अनुमति देता है। अंत में as const जोड़कर, पूरी संरचना को स्थिर कर दिया जाता है और केवल-पढ़ने के लिए बना दिया जाता है, जिससे सभी गुण उनके सटीक शाब्दिक प्रकारों में परिवर्तित हो जाते हैं:

const colors = ['red', 'green', 'blue'] as const;
// colors[0] = "yellow"; // Error: array is read-only

टेम्पलेट शाब्दिक प्रकार

टेम्प्लेट शाब्दिक प्रकार जावास्क्रिप्ट टेम्प्लेट स्ट्रिंग्स के शीर्ष पर बनाए जाते हैं, लेकिन टाइप पोजीशन में उपयोग किए जाते हैं। वे कई शाब्दिक प्रकारों को एक में संयोजित करने की अनुमति देते हैं:

type Size = 'small' | 'large';
type Color = 'red' | 'blue';

// Creates the union: "small-red" | "small-blue" | "large-red" | "large-blue"
type ItemId = `${Size}-${Color}`;

टेम्पलेट शाब्दिक प्रकारों में स्ट्रिंग उपयोगिताएँ

टाइपस्क्रिप्ट टेम्पलेट शाब्दिक प्रकारों के भीतर वर्णों में हेरफेर करने के लिए विशेष उपयोगिता प्रकार प्रदान करता है:

• Capitalize<StringType>: स्ट्रिंग के पहले अक्षर को बड़ा करता है।
• Uncapitalize<StringType>: स्ट्रिंग के पहले अक्षर को बड़े अक्षर से हटाता है।
• Uppercase<StringType>: संपूर्ण स्ट्रिंग को अपरकेस में परिवर्तित करता है।
• Lowercase<StringType>: संपूर्ण स्ट्रिंग को लोअरकेस में परिवर्तित करता है।

type ActionType = 'click' | 'hover';

// Generates: "onClick" | "onHover"
type EventHandlers = `on${Capitalize<ActionType>}`;

खुद कोशिश करना

अभ्यास 1: दिशा शाब्दिक संघ

अभ्यास 2: JSON.parse पर अभिकथन

अभ्यास 3: घटनाओं के लिए टेम्पलेट शाब्दिक

अभ्यास 4: बड़े अक्षरों के साथ टेम्पलेट शाब्दिक प्रकार