TypeScript Academy · पाठ

संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान

समझें कि TypeScript आसपास के संदर्भ से प्रकारों का अनुमान कैसे लगाता है

पाठ 2, कुल 4 में से13 चरण

संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान, CoddyKit पर TypeScript Academy का एक निःशुल्क पाठ है। यह 4 में से 2वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह TypeScript Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। TypeScript Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

संदर्भ-आधारित प्रकार-निर्धारण क्या है?

संदर्भ-आधारित प्रकार-निर्धारण तब होता है जब TypeScript किसी अभिव्यक्ति के प्रकार का अनुमान उसके दिखाई देने वाले स्थान के आधार पर लगाता है — प्रकार स्वयं मान से नहीं, बल्कि संदर्भ से मिलता है।

document.addEventListener("click", (e) => {
  // e is inferred as MouseEvent from the event type
  console.log(e.clientX);
});

कॉलबैक में संदर्भ-आधारित प्रकार-निर्धारण

जब आप किसी प्रकार-सुरक्षित फ़ंक्शन को कॉलबैक देते हैं, तो TypeScript अपेक्षित कॉलबैक हस्ताक्षर से पैरामीटर के प्रकारों का अनुमान लगाता है।

const nums = [1, 2, 3];
nums.forEach((n) => {
  // n inferred as number from Array<number>
  console.log(n.toFixed(2));
});

ऑब्जेक्ट लिटरल और संदर्भ-आधारित प्रकार-निर्धारण

जब किसी ऑब्जेक्ट लिटरल को प्रकार वाले चर में असाइन किया जाता है, तो उसके गुणों के प्रकार उसी प्रकार से अनुमानित होते हैं, जिससे सटीक जाँच संभव होती है।

interface Config { timeout: number; retries: number; }
const config: Config = {
  timeout: 3000,
  retries: 3,
  // extra: true // Error: excess property
};

JSX में संदर्भ-आधारित प्रकार-निर्धारण

React में इवेंट हैंडलर गुणों के प्रकार संदर्भ के आधार पर निर्धारित होते हैं, इसलिए इवेंट पैरामीटर के प्रकारों का अनुमान अपने-आप लग जाता है।

function Button({ onClick }: { onClick: (e: React.MouseEvent) => void }) {
  return <button onClick={onClick}>Click</button>;
}
// Caller: e is inferred as React.MouseEvent
<Button onClick={(e) => console.log(e.currentTarget)} />

संदर्भ-आधारित बनाम स्पष्ट प्रकार-टिप्पणियाँ

संदर्भ-आधारित प्रकार-निर्धारण शक्तिशाली है, लेकिन स्पष्ट प्रकार-टिप्पणियों से इसे बदला जा सकता है। दोनों मौजूद होने पर स्पष्ट प्रकार-टिप्पणी संदर्भ-आधारित प्रकार-निर्धारण पर प्राथमिकता पाती है।

const handler: (x: string) => void = (x: number) => {}; // Error
// Explicit annotation (number) conflicts with contextual (string)

डिस्ट्रक्चरिंग के साथ संदर्भ-आधारित प्रकार-निर्धारण

संदर्भ-आधारित प्रकार वाले फ़ंक्शन में डिस्ट्रक्चर किए गए पैरामीटर भी अपना प्रकार संदर्भ से प्राप्त करते हैं।

const pairs: [string, number][] = [["a", 1]];
pairs.forEach(([key, value]) => {
  // key: string, value: number — contextually typed
  console.log(key.toUpperCase(), value * 2);
});

संदर्भ-आधारित प्रकार-निर्धारण और वापसी प्रकार

जब किसी फ़ंक्शन को प्रकार वाले चर में असाइन किया जाता है, तो उसके वापसी प्रकार का अनुमान भी संदर्भ के आधार पर लगाया जाता है।

type Transform = (x: number) => string;
const double: Transform = (x) => x * 2; // Error: number not string
const str: Transform = (x) => String(x * 2); // OK

सशर्त अभिव्यक्तियों में संदर्भ-आधारित प्रकार-निर्धारण

TypeScript टर्नरी अभिव्यक्तियों और लॉजिकल ऑपरेटरों में संदर्भ-आधारित प्रकारों को आगे पहुँचा सकता है।

const result: string | null =
  Math.random() > 0.5 ? "yes" : null; // both arms typed by context

संदर्भ-आधारित प्रकार-निर्धारण की सीमाएँ

जब अभिव्यक्ति ऐसे स्थान पर हो जहाँ कोई संदर्भ उपलब्ध न हो, तब संदर्भ-आधारित प्रकार-निर्धारण लागू नहीं होता; उदाहरण के लिए, बिना प्रकार-टिप्पणी वाले स्वतंत्र चर में।

const fn = (x) => x + 1; // x: any — no context to infer from
// Add annotation: const fn = (x: number) => x + 1;

द्विदिश प्रकार-अनुमान

TypeScript द्विदिश प्रकार-अनुमान करता है: ऊपर से नीचे की ओर (संदर्भ-आधारित) और नीचे से ऊपर की ओर (अभिव्यक्ति से)। दोनों मिलकर आपको सबसे सटीक प्रकार प्रदान करते हैं।

function apply<T>(fn: (x: T) => T, val: T): T { return fn(val); }
apply((x) => x.toUpperCase(), "hello"); // x inferred as string

पुनरावलोकन: संदर्भ-आधारित प्रकार-निर्धारण

संदर्भ-आधारित प्रकार-निर्धारण TypeScript को उस स्थान से प्रकारों का अनुमान लगाने देता है जहाँ अभिव्यक्ति का उपयोग होता है — कॉलबैक, असाइनमेंट, JSX गुण और डिस्ट्रक्चरिंग सभी इस अनुमान से लाभान्वित होते हैं।

त्वरित जाँच

कॉलबैक पैरामीटर पर संदर्भ-आधारित प्रकार-निर्धारण कब लागू होता है?

आपने क्या सीखा

संदर्भ-आधारित प्रकार-निर्धारण का अर्थ है कि TypeScript मान के बजाय स्थान से प्रकारों का अनुमान लगाता है। यह प्रकार-सुरक्षित रहते हुए कॉलबैक, इवेंट हैंडलर और प्रकार वाले असाइनमेंट को संक्षिप्त बनाता है।

शुरुआत निःशुल्क

एआई शिक्षक के साथ TypeScript सीखें — निःशुल्क

अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।

पाठ्यक्रम
101
पाठ
352

अक्सर पूछे जाने वाले प्रश्न

क्या “संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान” पाठ निःशुल्क है?

हाँ—“संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और TypeScript Academy पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। TypeScript Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

“संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान” में मैं क्या सीखूँगा?

समझें कि TypeScript आसपास के संदर्भ से प्रकारों का अनुमान कैसे लगाता है आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ TypeScript Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।

क्या TypeScript Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?

पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर TypeScript Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 2वाँ पाठ है।

“संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान” पाठ पूरा करने में कितना समय लगता है?

CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।

क्या मैं इस TypeScript Academy पाठ में कोड लिख और चला सकता हूँ?

हाँ। हर TypeScript Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।

इस पाठ्यक्रम के सभी पाठ

  1. प्रकारों को विस्तृत और सीमित करने की प्रक्रिया
  2. संदर्भ-आधारित टाइपिंग: संदर्भ से अनुमान
  3. ताज़गी और अतिरिक्त गुणों की जाँच
  4. const अभिकथन और as const
← TypeScript Academy पर वापस जाएँ