TypeScript 5 की नई विशेषताएँ — satisfies ऑपरेटर और डेकोरेटर्स का व्यावहारिक उपयोग

मुख्य निष्कर्ष TypeScript 5.0~5.4 की प्रमुख नई सुविधाएँ: ① satisfies ऑपरेटर — अनुमान को बनाए रखते हुए प्रकारों की जाँच ② मानक डेकोरेटर — मेटाडेटा समर्थन के साथ TC39 Stage 3 मानक के अनुरूप ③ const प्रकार पैरामीटर — अधिक सशक्त लिटरल प्रकार अनुमान ④ कई tsconfig फ़ाइलों का विस्तार ⑤ enum और namespace में सुधार। व्यावहारिक रूप से सबसे अधिक प्रभाव डालने वाली सुविधाएँ satisfies और नए डेकोरेटर हैं।

मूल उत्तर: TypeScript 5 की प्रमुख सुविधाएँ satisfies ऑपरेटर और मानक डेकोरेटर हैं।

TypeScript 5 का अवलोकन

संस्करण के अनुसार प्रमुख रिलीज़ समयरेखा:

1. satisfies ऑपरेटर — एक संपूर्ण व्यावहारिक मार्गदर्शिका

satisfies ऑपरेटर TypeScript 5.0 में पेश की गई सबसे अभिनव सुविधाओं में से एक है। यह प्रकार अनुमान को बनाए रखते हुए प्रकार संबंधी बाधाओं की जाँच करके पारंपरिक टाइप असर्शन की सीमाओं से आगे जाता है।

मौजूदा समस्या

// ❌ Korean term Korean term Korean term type Color = "red" | "green" | "blue"; type ColorMap = Record;

// as Korean term: Korean term Korean term O, Korean term X const palette = { red: [255, 0, 0], green: "#00ff00", blue: [0, 0, 255] } as ColorMap;

// Korean term palette.redKorean term string | number[] Korean term Korean term // .map()Korean term Korean term Korean term Korean term Korean term palette.red.map(x => x); // Korean term! string | number[]Korean term map Korean term

satisfies का उपयोग

// ✅ satisfies Korean term type Color = "red" | "green" | "blue"; type ColorMap = Record;

} satisfies ColorMap;

// Korean term Korean term Korean term O, Korean term Korean term O palette.red.map(x => x); // ✅ number[] Korean term palette.green.toUpperCase(); // ✅ string Korean term const wrong = { purple: "purple" } satisfies ColorMap; // ❌ Korean term: "purple"Korean term Color Korean term

व्यावहारिक उपयोग के पैटर्न

पैटर्न 1: API रिस्पॉन्स ऑब्जेक्ट को सत्यापित करना interface ApiConfig { baseUrl: string; timeout: number; retries: number; }

// satisfiesKorean term Korean term Korean term + Korean term Korean term Korean term Korean term const config = { baseUrl: "https://api.example.com", timeout: 5000, retries: 3, } satisfies ApiConfig;

// config.timeoutKorean term numberKorean term Korean term 5000 (Korean term Korean term) type TimeoutType = typeof config.timeout; // 5000

पैटर्न 2: रूट की परिभाषाएँ type Route = { path: string; component: React.ComponentType; auth?: boolean; };

const routes = [ { path: "/", component: Home }, { path: "/dashboard", component: Dashboard, auth: true }, ] satisfies Route[];

// routes[0].pathKorean term "/" (Korean term) Korean term, Route Korean term Korean term

पैटर्न 3: बहुभाषी अनुवाद ऑब्जेक्ट type TranslationKey = "hello" | "goodbye" | "welcome"; type Translations = Record;

const ko = { hello: "Korean term", goodbye: "Korean term Korean term", welcome: "Korean term", } satisfies Translations;

const en = { hello: "Hello", goodbye: "Goodbye", // welcome Korean term → Korean term Korean term Korean term! ✅ } satisfies Translations;

2. स्टैंडर्ड डेकोरेटर — पूर्ण TC39 स्टेज 3 कार्यान्वयन TypeScript 5.0 लंबे समय से उपयोग किए जा रहे प्रयोगात्मक डेकोरेटर (experimentalDecorators) से अलग, TC39 स्टेज 3 स्टैंडर्ड डेकोरेटर का समर्थन करता है।

मुख्य अंतर

क्लास डेकोरेटर

// ✅ TypeScript 5 Korean term Korean term function sealed(target: typeof SealedClass) { Object.seal(target); Object.seal(target.prototype); }

@sealed class SealedClass { greet() { return "Hello!"; } }

मेथड डेकोरेटर

function log(target: any, context: ClassMethodDecoratorContext) { const methodName = String(context.name); return function (this: any, ...args: any[]) { console.log([${methodName}] Korean term, Korean termwater:, args); const result = target.call(this, ...args); console.log([${methodName}] Korean term:, result); return result; }; }

class Calculator { @log add(a: number, b: number): number { return a + b; } }

const calc = new Calculator(); calc.add(1, 2); // [add] Korean term, Korean termwater: [1, 2] // [add] Korean term: 3

एक्सेसर डेकोरेटर

function readonly(target: any, context: ClassAccessorDecoratorContext) { return { set() { throw new Error(${String(context.name)}Korean term Korean term Korean term.); } }; }

class Config { @readonly accessor version = "1.0.0"; }

const cfg = new Config(); console.log(cfg.version); // "1.0.0" cfg.version = "2.0.0"; // ❌ Korean term Korean term

डेकोरेटर मेटाडेटा (TypeScript 5.2)

// Korean term API Korean term function validate(target: any, context: ClassFieldDecoratorContext) { context.metadata[context.name] = { required: true }; }

class UserForm { @validate name!: string; @validate email!: string; }

// Korean term Korean term const metadata = UserForm[Symbol.metadata]; console.log(metadata); // { name: { required: true }, email: { required: true } }

3. const टाइप पैरामीटर TypeScript 5.0 में जोड़ा गया const मॉडिफ़ायर जेनेरिक फ़ंक्शनों के लिए टाइप इन्फ़रेंस को अधिक सटीक बनाता है।

// ❌ Korean term Korean term function identity(value: T): T { return value; }

const result = identity(["a", "b", "c"]); // result: string[] (Korean term Korean term)

// ✅ const Korean term Korean term function identityConst(value: T): T { return value; }

const result2 = identityConst(["a", "b", "c"]); // result2: readonly ["a", "b", "c"] (Korean term Korean term!)

व्यावहारिक उपयोग: रूट बिल्डर function createRoute(path: Path) { return { path, url: () => https://app.example.com${path} }; }

const homeRoute = createRoute("/"); // homeRoute.path: "/" (Korean term Korean term)

const dashRoute = createRoute("/dashboard"); // dashRoute.path: "/dashboard" (Korean term Korean term)

4. एकाधिक tsconfig फ़ाइलों को एक्सटेंड करना TypeScript 5.0 से, tsconfig.json में extends के लिए ऐरे का उपयोग किया जा सकता है।

// tsconfig.json { "extends": [ "@tsconfig/strictest/tsconfig.json", "@tsconfig/node18/tsconfig.json", "./custom.tsconfig.json" ], "compilerOptions": { "outDir": "dist" } }

पहले, कई फ़ाइलों को एक शृंखला के माध्यम से इनहेरिट करना पड़ता था, लेकिन अब ऐरे की मदद से एक साथ मल्टिपल इनहेरिटेंस संभाला जा सकता है।

5. using / await using कीवर्ड (TypeScript 5.2)

ये रिसोर्स मैनेजमेंट के लिए नए कीवर्ड हैं, जो Java के try-with-resources जैसे हैं।

// Symbol.disposeकोरियाई शब्द कोरियाई शब्द कोरियाई शब्द cla

---

संदर्भ: बैंक ऑफ़ कोरिया के आर्थिक आँकड़े

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

प्रश्न 1. TypeScript 5 की सबसे महत्वपूर्ण नई विशेषता क्या है?

उत्तर: satisfies ऑपरेटर, मानक डेकोरेटर और const टाइप पैरामीटर का व्यावहारिक प्रभाव सबसे अधिक है।

प्रश्न 2. मुझे satisfies ऑपरेटर का उपयोग कब करना चाहिए?

उत्तर: इसका उपयोग तब करें, जब आप किसी ऑब्जेक्ट के सटीक टाइप अनुमान को बनाए रखते हुए यह सत्यापित करना चाहते हों कि वह विशिष्ट टाइप आवश्यकताओं को पूरा करता है।

प्रश्न 3. satisfies और as में क्या अंतर है?

उत्तर: as एक टाइप असर्शन है, जबकि satisfies टाइप वैलिडेशन करता है, इसलिए यह गलत संरचनाओं को अधिक सुरक्षित ढंग से पकड़ लेता है।

प्रश्न 4. क्या TypeScript 5 के डेकोरेटर पुराने डेकोरेटरों से अलग हैं?

उत्तर: मानक डेकोरेटर TC39 प्रक्रिया का पालन करते हैं और मौजूदा experimentalDecorators से अलग ढंग से काम करते हैं।

प्रश्न 5. const टाइप पैरामीटर उपयोगी क्यों हैं?

उत्तर: वे जेनेरिक फ़ंक्शनों में लिटरल टाइप अनुमान को बनाए रखते हैं, जिससे आप अधिक सटीक टाइप बना सकते हैं।

प्रश्न 6. TypeScript 5 में अपग्रेड करने से पहले मुझे क्या जाँचना चाहिए?

उत्तर: tsconfig, डेकोरेटर के उपयोग, बिल्ड टूल्स, ESLint और लाइब्रेरी टाइप की अनुकूलता की जाँच करें।