😵 👼🏻 🏛️ टाइपस्क्रिप्ट 3.0 🗞️ 👩🏾‍🚀 👵

टाइपस्क्रिप्ट 3.0! हां, वह बाहर आया, और इसमें वास्तव में बहुत सारे नवाचार हैं। कटौती के तहत आपको बिल्ड मोड, एक नया प्रकार अज्ञात, एपीआई में महत्वपूर्ण परिवर्तन, प्रदर्शन में सुधार और बहुत कुछ सहित सभी नवीनतम नवाचारों का विस्तृत विवरण मिलेगा। अब सम्मिलित हों!

टाइपस्क्रिप्ट 3.0 जारी! सभी जावास्क्रिप्ट उपयोगकर्ताओं के लिए सहायक टाइपस्क्रिप्ट विकसित करने के लिए सड़क पर एक नया मील का पत्थर शुरू हो गया है।

यदि आप टाइपस्क्रिप्ट से परिचित नहीं हैं, तो अभी इसके बारे में जानने में देर नहीं हुई है! टाइपस्क्रिप्ट एक जावास्क्रिप्ट एक्सटेंशन है जिसे स्थैतिक प्रकारों की इस भाषा के आधुनिक संस्करण में उपयोग के लिए डिज़ाइन किया गया है। टाइपस्क्रिप्ट कंपाइलर टाइपस्क्रिप्ट कोड को पढ़ता है, जिसमें विशेष रूप से, प्रकार की घोषणाएँ और प्रकार एनोटेशन होते हैं, और स्वच्छ, आसानी से पढ़ने वाले जावास्क्रिप्ट कोड का निर्माण करते हैं जिसमें ये निर्माण रूपांतरित और हटाए जाते हैं। परिणामी कोड किसी भी रनटाइम वातावरण में चलता है जो ECMAScript मानक का अनुपालन करता है, उदाहरण के लिए, आपके पसंदीदा ब्राउज़र में या Node.js सर्वर प्लेटफ़ॉर्म पर।

इस तरह के वातावरण का उपयोग करने का अर्थ है कि उपयोगकर्ताओं द्वारा लॉन्च किए जाने से पहले त्रुटियों या टाइपोस के लिए कोड का विश्लेषण किया जाएगा, लेकिन इसके फायदे इसके लिए सीमित नहीं हैं। इन सभी सूचनाओं और विश्लेषण परिणामों के साथ, टाइमस्क्रिप्ट स्वचालित कोड पूर्णता और नेविगेशन उपकरण प्रदान करके प्रयोज्यता को बढ़ाता है जैसे कि अपने पसंदीदा संपादक में सभी संदर्भ, गो टू डेफिनिशन और नाम बदलें। ।

भाषा के साथ आरंभ करने और अधिक जानकारी प्राप्त करने के लिए, लिंक का अनुसरण करें । यदि आप अभी TypeScript 3.0 आज़माना चाहते हैं, तो आप इसे NuGet से या npm से टाइप करके डाउनलोड कर सकते हैं

npm install -g typescript

इसके अलावा, समर्थन निम्नलिखित संपादकों में उपलब्ध है:

दृश्य स्टूडियो 2017 (संस्करण 15.2 और बाद में);
विजुअल स्टूडियो 2015 (अपडेट 3 आवश्यक);
विज़ुअल स्टूडियो कोड ( आपको प्रारंभिक रिलीज़ स्थापित करने की आवश्यकता है , जबकि यह सुविधा मुख्य में समर्थित नहीं है);
PackageControl वेबसाइट पर उदात्त पाठ 3 ।

अन्य संपादकों को उनके स्वयं के शेड्यूल के अनुसार अपडेट किया जाता है, लेकिन जल्द ही उन सभी को उत्कृष्ट टाइपस्क्रिप्ट समर्थन मिलेगा।

संस्करण 3.0 अवलोकन

टाइपस्क्रिप्ट 2.0 की रिलीज़ के बाद, हमने इसकी वर्तमान स्थिति में पिछले संस्करणों के योगदान का संक्षिप्त विवरण दिया। टाइपस्क्रिप्ट 1.0 और 2.0 के रिलीज के बीच, भाषा में यूनियन प्रकार, प्रकार गार्ड, आधुनिक ईसीएमएस्क्रिप्ट मानक के लिए समर्थन, प्रकार उपनाम, जेएसएक्स समर्थन, शाब्दिक और बहुरूपिक शामिल हैं। यदि आप टाइपस्क्रिप्ट 2.0 प्रकारों को शामिल करते हैं जो शून्य-सक्षम नहीं हैं, तो प्रवाह विश्लेषण को नियंत्रित करें, टैग किए गए यूनियनों के लिए समर्थन, इस प्रकार, और .d.ts फ़ाइलों को प्राप्त करने के लिए एक सरलीकृत मॉडल, हम कह सकते हैं कि इस अवधि ने मूल रूप से पूरी तरह से निर्धारित किया है। टाइपस्क्रिप्ट काम करते हैं।

तो तब से क्या किया गया है? ईसीएमएस्क्रिप्ट मानक की नई विशेषताओं के अलावा, टाइपस्टाइप 3.0 के लिए हमें किस कारण से लाया गया, जैसे कि async / एसिंक्रोनस फ़ंक्शंस, जनरेटर, और बाकी / प्रसार ऑपरेटर?

टाइपस्क्रिप्ट 2.1 मौलिक रिलीज़ बन गया, जिसने जावास्क्रिप्ट में एक स्थिर मेटाप्रोग्रामिंग मॉडल पेश किया। मुख्य अनुरोध ( keyof ), इंडेक्स एक्सेस ( T[K] ) और मैप किए गए ऑब्जेक्ट्स के प्रकार ( { [K in keyof T]: } T[K]} ) - यह उन उपकरणों की एक सूची है जिनका उपयोग रिएक्ट, एम्बर लाइब्रेरीज़ को और अधिक प्रभावी ढंग से करने के लिए किया गया था, लोदाश और अन्य।

टाइपस्क्रिप्ट 2.2 और 2.3 रिलीज ने मिक्सिन क्लास टेम्प्लेट, object प्रकार (एक ऐसी वस्तु का प्रतिनिधित्व करना जो एक आदिम नहीं है) के लिए समर्थन पेश किया, और सामान्य प्रकारों के लिए डिफ़ॉल्ट मान। इन विशेषताओं का उपयोग कई परियोजनाओं में किया गया है, जैसे कि कोणीय सामग्री और पॉलिमर। इसके अलावा, टाइपस्क्रिप्ट 2.3 ने this प्रकार को ठीक करने की क्षमता का परिचय दिया, जिससे भाषा पुस्तकालयों जैसे Vue के साथ अच्छी तरह से काम कर checkJs , और checkJs ध्वज को जावास्क्रिप्ट फ़ाइलों में जाँच करने की अनुमति देने के लिए checkJs गया।

टाइपस्क्रिप्ट 2.4 और 2.6 फ़ंक्शन प्रकार की जाँच की गंभीरता को बढ़ाने की कहानी को जारी रखते हैं, जो हमारे टाइप सिस्टम की कुछ सबसे पुरानी समीक्षाओं से जुड़ा हुआ है। - --strictFunctionTypes ध्वज की शुरुआत की गई थी, जो मापदंडों के --strictFunctionTypes को मजबूर करता है। 2.7 रिलीज में, कड़ाई की ओर रुझान बना हुआ है और - --strictPropertyInitialization फ्लैग का उपयोग करके कक्षाओं में सत्यापन में व्यक्त किया गया है।

टाइपस्क्रिप्ट 2.8 सशर्त प्रकारों को पेश करता है, सांख्यिकीय रूप से टाइप-आधारित निर्णयों को व्यक्त करने के लिए एक शक्तिशाली उपकरण है, और 2.9 रिलीज कीऑफ़ ऑपरेटर को सामान्य करता है और प्रकारों के लिए आयात को सरल करता है।

और यह हमें टाइपस्क्रिप्ट 3.0 में लाता है! संख्या में नए पूर्णांक के बावजूद, रिलीज 3.0 में थोड़ा बदल गया है (जिसका अर्थ है एक बहुत आसान अद्यतन)। यह संरचना परियोजनाओं के लिए एक नया लचीला और स्केलेबल तरीका पेश करता है, पैरामीटर सूचियों के साथ काम करने के लिए शक्तिशाली नया समर्थन, स्पष्ट जांच प्रदान करने के लिए नए प्रकार, बेहतर JSX समर्थन, काफी अधिक उपयोगकर्ता के अनुकूल त्रुटि निदान, और बहुत कुछ।

नया क्या है

प्रोजेक्ट लिंक
- --build मोड
- आउटपुट संरचना प्रबंधन
- भविष्य की योजना
ट्यूपल्स का उपयोग करके पैरामीटर सूचियों को पुनः प्राप्त करना और वितरित करना
नई टपल प्रकार की विशेषताएं
unknown टाइप करें
बेहतर त्रुटि निदान और उपयोगकर्ता वातावरण
- एसोसिएटेड एरर रेंज
- बेहतर निदान और त्रुटि से निपटने
defaultProps में defaultProps लिए समर्थन
निर्देश /// <reference lib="..." />
संपादक की गति में सुधार
- आयात बयानों को नाम देना
- अंतिम टैग अंत और रूपरेखा रूपरेखा
- अगम्य कोड और अप्रयुक्त टैग के लिए त्वरित सुधार
महत्वपूर्ण परिवर्तन
- unknown एक आरक्षित प्रकार का नाम है
- एपीआई महत्वपूर्ण परिवर्तन

प्रोजेक्ट लिंक

काफी बार, लाइब्रेरी या एप्लिकेशन बनाने के लिए, आपको कई चरणों का पालन करने की आवश्यकता होती है। मान लीजिए कि आपके कोड आधार में src और test निर्देशिकाएं हैं। मान लें कि आपके पास एक client फ़ोल्डर है जहां एप्लिकेशन के क्लाइंट भाग का कोड संग्रहीत है, और एक सर्वर फ़ोल्डर जिसमें Node.js प्लेटफ़ॉर्म पर सर्वर पार्ट कोड है, और उनमें से प्रत्येक shared फ़ोल्डर से कोड का हिस्सा लेता है। शायद आप तथाकथित "एकल भंडार" का उपयोग कर रहे हैं और कई परियोजनाएं हैं जो एक दूसरे पर जटिल रूप से निर्भर हैं।

टाइपस्क्रिप्ट 3.0 जारी करते समय हमने जिन सबसे महत्वपूर्ण विशेषताओं पर काम किया था, उनमें से एक को "प्रोजेक्ट लिंक" कहा गया था और इसे इस तरह की स्क्रिप्ट के साथ काम करने के लिए सरल बनाया गया है।

प्रोजेक्ट लिंक के लिए धन्यवाद, कुछ टाइपस्क्रिप्ट प्रोजेक्ट दूसरों पर निर्भर हो सकते हैं। विशेष रूप से, tsconfig.json फ़ाइलों tsconfig.json अन्य tsconfig.json फ़ाइलों को संदर्भित करने की अनुमति है। इन निर्भरताओं को परिभाषित करने से कोड को छोटी परियोजनाओं में विभाजित करना आसान हो जाता है, क्योंकि टाइपस्क्रिप्ट कंपाइलर (और इसके उपकरण) को आउटपुट के असेंबली ऑर्डर और संरचना को समझने का अवसर मिलता है। इसका मतलब है कि असेंबली तेज़ है और विभिन्न चरणों के लिए वृद्धिशील रूप से (चरणों में) प्रदर्शन किया जाता है, पारदर्शी नेविगेशन, संपादन और रीफ़ैक्टरिंग। चूंकि टाइपस्क्रिप्ट 3.0 परियोजना के लिए नींव देता है और एपीआई प्रदान करता है, कोई भी निर्माण उपकरण इसे प्रदान करने में सक्षम होना चाहिए।

यह कैसा दिखता है?

यहाँ एक tsconfig.json फ़ाइल है, जिसमें एक सरल उदाहरण के रूप में परियोजनाओं के लिंक हैं।

 // ./src/bar/tsconfig.json { "compilerOptions": { // Needed for project references. "composite": true, "declaration": true, // Other options... "outDir": "../../lib/bar", "strict": true, "module": "esnext", "moduleResolution": "node", }, "references": [ { "path": "../foo" } ] }

इसके दो नए क्षेत्र हैं: composite और references ।

references फ़ील्ड केवल अन्य tsconfig.json फ़ाइलों (या फ़ोल्डर जिसमें वे निहित हैं) को इंगित करती हैं। यहां प्रत्येक लिंक केवल path फ़ील्ड ("पथ") के साथ एक ऑब्जेक्ट है और टाइपस्क्रिप्ट कंपाइलर को बताता है कि इस प्रोजेक्ट को बनाने के लिए, आपको पहले एक और प्रोजेक्ट बनाना होगा, जिसमें यह संदर्भित हो।

जाहिर है, composite क्षेत्र का एक ही महत्व है। composite क्षेत्र सुनिश्चित करता है कि कुछ पैरामीटर सक्षम हैं जो किसी भी परियोजना को अनुमति देते हैं जो इस पर निर्भर करता है और इसे वृद्धिशील बिल्ड में शामिल करता है। बुद्धिमानी और वृद्धिशील निर्माण की क्षमता महत्वपूर्ण है, क्योंकि आप एक परियोजना को छोड़ सकते हैं मुख्य कारणों में से एक है गति का निर्माण।

उदाहरण के लिए, यदि front-end प्रोजेक्ट shared प्रोजेक्ट पर निर्भर करता है, और कोर पर shared किया जाता है, तो प्रोजेक्ट लिंक से जुड़े हमारे एपीआई कोर में बदलावों की पहचान करने में मदद करेंगे, लेकिन core प्रोजेक्ट द्वारा उत्पादित प्रकार बदल गए हैं (यानी) .d.ts फ़ाइलें)। इसका मतलब यह है कि कोर में बदलाव से सभी परियोजनाओं का एक वैश्विक आश्वासन नहीं मिलता है। इस कारण से, composite ध्वज की स्थापना भी declaration ध्वज की स्थापना का कारण बनती है।

-बिल्ड मोड

टाइपस्क्रिप्ट 3.0 परियोजना के संदर्भ के लिए एपीआई का एक सेट पेश करेगा ताकि अन्य उपकरण इस त्वरित वृद्धिशील निर्माण विधि प्रदान कर सकें। विशेष रूप से, गुलप-टाइपस्क्रिप्ट प्लगइन पहले से ही इन एपीआई का उपयोग करता है! इस प्रकार, बाद में परियोजनाओं के लिंक को आपकी पसंद के विधानसभा ऑर्केस्ट्रेटर के साथ एकीकृत किया जाएगा।

हालांकि, कई सरल अनुप्रयोगों और पुस्तकालयों के लिए, बाहरी उपकरणों का उपयोग न करने की सलाह दी जाती है। यही कारण है कि --build कमांड अब एक नया ध्वज सेट करता है।

tsc --build (या उसके उपनाम, tsc --build tsc -b ) परियोजनाओं का एक सेट लेता है और उन्हें बनाता है, साथ ही साथ आश्रित परियोजनाएं भी। नए बिल्ड मोड का उपयोग करते समय, सबसे पहले, - --build ध्वज सेट किया जाना चाहिए, और इसे कुछ अन्य झंडों के साथ जोड़ा जा सकता है:

--verbose : बिल्ड प्रक्रिया द्वारा आवश्यक प्रत्येक चरण दिखाता है।
--dry : आउटपुट फ़ाइलों को जनरेट किए बिना --dry ( --verbose विकल्प के साथ संयोजन में उपयोगी)।
–clean : निर्दिष्ट इनपुट से मेल खाते आउटपुट फ़ाइलों को हटाने का –clean करता है।
--force : प्रोजेक्ट के पूर्ण, गैर-वृद्धिशील निर्माण के लिए मजबूर करता है।

आउटपुट संरचना प्रबंधन

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

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

उदाहरण के लिए, यदि क्लाइंट / index.ts और server / index.ts दोनों निम्नलिखित परियोजनाओं के लिए साझा / index.ts को संदर्भित करते हैं:

... तो जब हम क्लाइंट और सर्वर प्रोजेक्ट बनाने की कोशिश करते हैं, तो हम ...

... नहीं ...

ध्यान दें कि निर्माण के बाद, हमें क्लाइंट और सर्वर दोनों में साझा फ़ोल्डर की प्रतियां मिलीं। हमने दो बार साझा असेंबली के निर्माण पर अतिरिक्त समय व्यतीत किया और लिबास / क्लाइंट / क्लाइंट और लिब / सर्वर / सर्वर से नेस्टिंग का अवांछनीय स्तर जोड़ा।

समस्या यह है कि टाइपस्क्रिप्ट उत्सुकता से .ts फ़ाइलों को खोजता है और उन्हें इस संकलन में शामिल करने की कोशिश करता है। आदर्श रूप से, टाइपस्क्रिप्ट को समझना चाहिए कि इन फ़ाइलों को एक ही संकलन में विधानसभा में भाग नहीं लेना चाहिए, और इसके बजाय टाइप जानकारी के लिए .d.ts फ़ाइलों पर जाएं।

साझा करने के लिए tsconfig.json फ़ाइल बनाना वास्तव में इस परिणाम का उत्पादन करता है। यह टाइपस्क्रिप्ट कंपाइलर को संकेत देता है:

साझा परियोजना को स्वतंत्र रूप से बनाया जाना चाहिए
और यह कि जब .. से आयात किया जा रहा है, तो हमें अपने आउटपुट निर्देशिका में .d.ts फ़ाइलों की तलाश करनी चाहिए।

यह एक डबल असेंबली चलाने से बचता है, साथ ही गलती से सभी साझा सामग्री सहित।

भविष्य की योजना

डिज़ाइन लिंक और उनके उपयोग की संभावनाओं की गहरी समझ पाने के लिए, इस रिलीज़ के ट्रैकर में उनके बारे में अधिक विस्तार से पढ़ें। निकट भविष्य में, हम प्रोजेक्ट लिंक और बिल्ड मोड पर प्रलेखन तैयार करेंगे।

हम प्रयास करते हैं कि अन्य प्रोग्रामिंग टूल्स के लेखक इस फ़ंक्शन के संबंध में परियोजनाओं के संदर्भों को बनाए रख सकें और संपादन के माहौल को बेहतर बना सकें। हम यह सुनिश्चित करने का इरादा रखते हैं कि प्रोजेक्ट लिंक के साथ काम करना एक एकल tsconfig.json फ़ाइल के साथ कोड के रूप में सुचारू रूप से चलता है। यदि आप अंततः प्रोजेक्ट लिंक का उपयोग करना शुरू करते हैं, तो हम किसी भी प्रतिक्रिया के लिए आभारी होंगे।

ट्यूपल्स का उपयोग करके पैरामीटर सूचियों को पुनः प्राप्त करना और वितरित करना

हम अक्सर इसके लिए अनुमति देते हैं, लेकिन जावास्क्रिप्ट हमें पैरामीटर सूचियों को प्रथम श्रेणी के मूल्यों के रूप में विचार करने की अनुमति देता है - या तो तर्क या प्रकार आराम के मापदंडों (जैसे ... बाकी) का उपयोग करते हुए।

 function call(fn, ...args) { return fn(...args); }

ध्यान दें कि कॉल किसी भी संख्या में मापदंडों के साथ काम करता है। अन्य भाषाओं के विपरीत, जावास्क्रिप्ट हमें कॉल 0, कॉल 1, कॉल 2, आदि को परिभाषित करने के लिए मजबूर नहीं करता है:

 function call0(fn) { return fn(); } function call1(fn, param1) { return fn(param1); } function call2(fn, param1, param2) { return fn(param1, param2); } function call3(fn, param1, param2, param3) { return fn(param1, param2, param3); }

दुर्भाग्य से, कुछ समय के लिए ओवरलोड की एक सीमित संख्या घोषित किए बिना टाइपस्क्रिप्ट में इसे व्यक्त करने का कोई अच्छा तरीका नहीं था:

 // TODO (billg): 5 overloads should *probably* be enough for anybody? function call<T1, T2, T3, T4, R>(fn: (param1: T1, param2: T2, param3: T3, param4: T4) => R, param1: T1, param2: T2, param3: T3, param4: T4): R function call<T1, T2, T3, R>(fn: (param1: T1, param2: T2, param3: T3) => R, param1: T1, param2: T2, param3: T3): R function call<T1, T2, R>(fn: (param1: T1, param2: T2) => R, param1: T1, param2: T2): R function call<T1, R>(fn: (param1: T1) => R, param1: T1): R; function call<R>(fn: () => R, param1: T1): R; function call(fn: (...args: any[]) => any, ...args: any[]) { return fn(...args); }

ओह! हजार ओवरलोड से एक और मौत! या यूजर्स को कम से कम उतने ओवरलोड्स की जरूरत होती है।

टाइपस्क्रिप्ट 3.0 आपको ऐसे परिदृश्यों को बेहतर ढंग से अनुकरण करने की अनुमति देता है, क्योंकि अब बाकी प्रकार के पैरामीटर सार्वभौमिक हो सकते हैं, और उनके प्रकार को टपल के रूप में परिभाषित किया जाता है। इन ओवरलोडों में से प्रत्येक को घोषित करने के बजाय, हम कहते हैं कि बाकी पैरामीटर ... fn फ़ंक्शन से आर्ग्स एक प्रकार का पैरामीटर होना चाहिए जो कि सरणी का विस्तार करता है, और फिर इसे पुनः उपयोग करें ... args पैरामीटर के लिए कि कॉल फ़ंक्शन गुजरता है:

 function call<TS extends any[], R>(fn: (...args: TS) => R, ...args: TS): R { return fn(...args); }

जब हम कॉल फ़ंक्शन को कॉल करते हैं, तो टाइपस्क्रिप्ट उन मापदंडों की एक सूची निकालने की कोशिश करता है, जो हम fn के पास जाते हैं और इसे ट्यूपर में बदल देते हैं:

 function foo(x: number, y: string): string { return (x + y).toLowerCase(); } // The `TS` type parameter is inferred as `[number, string]` call(foo, 100, "hello");

जब टाइपस्क्रिप्ट टीएस को [संख्या, स्ट्रिंग] के रूप में परिभाषित करता है, और हम कॉल फ़ंक्शन के बाकी पैरामीटर पर टीएस का पुन: उपयोग करते हैं, तो फ़ंक्शन उदाहरण इस तरह दिखता है:

 function call(fn: (...args: [number, string]) => string, ...args: [number, string]): string

और टाइपस्क्रिप्ट 3.0 में, आराम में एक टपल का उपयोग करते समय, पैरामीटर को बाकी पैरामीटर सूची में न्यूनतम किया जाता है! उपरोक्त उदाहरण टुपल्स के बिना सरल मापदंडों के लिए नीचे आता है:

 function call(fn: (arg1: number, arg2: string) => string, arg1: number, arg2: string): string

इसलिए, अमान्य तर्क पास करते समय टाइप रूपांतरण त्रुटियों को पकड़ने के अलावा:

 function call<TS extends any[], R>(fn: (...args: TS) => R, ...args: TS): R { return fn(...args); } call((x: number, y: string) => y, "hello", "world"); // ~~~~~~~ // Error! `string` isn't assignable to `number`!

... और अन्य तर्कों से परिभाषा टाइप करें:

 call((x, y) => { /* .... */ }, "hello", 100); // ^ ^ // `x` and `y` have their types inferred as `string` and `number` respectively.

... हम उन प्रकारों को भी देख सकते हैं जिन्हें ये कार्य बाहर से परिभाषित करते हैं:

 function tuple<TS extends any[]>(...xs: TS): TS { return xs; } let x = tuple(1, 2, "hello"); // has type `[number, number, string]`

लेकिन एक कैविटी पर ध्यान दें। यह सब काम करने के लिए, हमें टुपल्स की क्षमताओं का विस्तार करना था ...

नई टपल प्रकार की विशेषताएं

एक टपल के रूप में पैरामीटर सूची को मॉडल करने के लिए (जैसा कि हमने अभी चर्चा की है), हमें टपल प्रकार को थोड़ा पुनर्विचार करना पड़ा। टाइपस्क्रिप्ट 3.0 के जारी होने से पहले, सबसे अच्छा जिसे ट्यूपल्स का उपयोग करके मॉडलिंग करने की अनुमति दी गई थी वह पैरामीटर सेट का क्रम और लंबाई थी।

हालाँकि, पैरामीटर सूचियाँ केवल क्रमबद्ध सूचियाँ नहीं हैं। उदाहरण के लिए, अंत में पैरामीटर वैकल्पिक हो सकते हैं:

 // Both `y` and `z` are optional here. function foo(x: boolean, y = 100, z?: string) { // ... } foo(true); foo(true, undefined, "hello"); foo(true, 200);

अंतिम पैरामीटर बाकी पैरामीटर हो सकता है।

 // `rest` accepts any number of strings - even none! function foo(...rest: string[]) { // ... } foo(); foo("hello"); foo("hello", "world");

और अंत में, पैरामीटर सूचियों की एक नहीं बल्कि दिलचस्प संपत्ति है - वे खाली हो सकती हैं:

 // Accepts no parameters. function foo() { // ... } foo();

इसलिए, ट्यूपल्स के लिए पैरामीटर सूचियों के अनुरूप होने के लिए, हमें इनमें से प्रत्येक परिदृश्य को अनुकरण करने की आवश्यकता है।

सबसे पहले, अब टपल के अंत में वैकल्पिक तत्व हो सकते हैं:

 /** * 2D, or potentially 3D, coordinate. */ type Coordinate = [number, number, number?];

निर्देशांक प्रकार 2 नाम की एक वैकल्पिक संपत्ति के साथ एक टपल बनाता है - इंडेक्स 2 के साथ एक तत्व को परिभाषित नहीं किया जा सकता है! दिलचस्प है, चूंकि ट्यूपल्स अपनी लंबाई संपत्ति के लिए एक संख्यात्मक शाब्दिक प्रकार का उपयोग करते हैं, क्यूडिनेट ट्यूपल की लंबाई संपत्ति टाइप 2 की है। 3।

दूसरे, बाकी तत्व अब टपल के अंत में मौजूद हो सकते हैं।

 type OneNumberAndSomeStrings = [number, ...string[]];

बाकी तत्वों के लिए धन्यवाद, ट्यूपल्स बहुत दिलचस्प "अंत से असीमित" व्यवहार दिखाते हैं। प्रकार OneNumberAndSomeStrings के उपरोक्त उदाहरण के लिए इसकी पहली संपत्ति के प्रकार की संख्या की आवश्यकता होती है, और टाइप स्ट्रिंग के एक या अधिक गुणों की अनुमति होती है। मनमाने ढंग से नंबर के साथ इस प्रकार के टपल को इंडेक्स करने से टाइप स्ट्रिंग लौट आती है संख्या, क्योंकि सूचकांक मूल्य अज्ञात है। इसी तरह, चूंकि टपल की लंबाई अज्ञात है, इसलिए लंबाई संपत्ति का मूल्य बस संख्या है।

यह ध्यान दिया जाना चाहिए कि अन्य तत्वों की अनुपस्थिति में, टपल में बाकी तत्व स्वयं के समान है:

 type Foo = [...number[]]; // Equivalent to `number[]`.

अंत में, ट्यूपल अब खाली हो सकते हैं! हालांकि यह बहुत उपयोगी नहीं है जब बाहरी पैरामीटर सूचियों का उपयोग किया जाता है, एक खाली टपल प्रकार को []: के रूप में परिभाषित किया जा सकता है।

 type EmptyTuple = [];

जैसा कि आप उम्मीद कर सकते हैं, एक खाली टपल की लंबाई 0 की संपत्ति है, और नंबर के साथ अनुक्रमण कभी नहीं लौटाता है।

बेहतर त्रुटि निदान और उपयोगकर्ता वातावरण

समय के साथ, हमें त्रुटि संदेशों के सुधार के बारे में हमारे समुदाय के सदस्यों से अधिक से अधिक अनुरोध प्राप्त होते हैं। हालाँकि यह काम पूरा नहीं हुआ है, फिर भी हमने आपसे सुना और टाइपस्क्रिप्ट 3.0 रिलीज़ में कई सुधार किए।

एसोसिएटेड एरर रेंज

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

संबद्ध त्रुटि श्रेणियां उपयोगकर्ताओं को यह जानकारी प्रदान करने का एक नया तरीका है। टाइपस्क्रिप्ट 3.0 में, त्रुटि संदेश कोड में कहीं और संदेश उत्पन्न कर सकते हैं ताकि उपयोगकर्ता त्रुटि के कारण और प्रभाव का पता लगा सकें।

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

टर्मिनल मोड में ये अंतराल तब भी दिखाई देंगे जब आप tsc कमांड चलाएंगे - व्याख्या मोड सक्षम होने के बावजूद, हम अभी भी यूजर इंटरफेस को बेहतर बनाने और आपकी प्रतिक्रिया पर विचार कर रहे हैं!

बेहतर निदान और त्रुटि से निपटने

टाइपस्क्रिप्ट 2.9 की रिहाई की तैयारी में, हमने त्रुटि संदेशों पर अधिक ध्यान देना शुरू किया , और 3.0 में रिलीज के दौरान हमने वास्तव में मुख्य कार्यों को हल करने की कोशिश की, जो हमें बुद्धिमान, स्पष्ट और सटीक त्रुटि निदान करने की अनुमति देगा। इसमें विशेष रूप से, संघ के प्रकारों में विसंगतियों के मामले में उपयुक्त प्रकारों का चयन और कुछ प्रकार के संदेशों के लिए त्रुटि के स्रोत से सीधे बाहर निकलना शामिल है।

हम मानते हैं कि हमारे प्रयासों को सही ठहराया गया है, और परिणामस्वरूप आपको छोटे और स्पष्ट त्रुटि संदेश प्राप्त होंगे।

अज्ञात टाइप करें

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

यह सुविधा आम तौर पर उपयोगी है, लेकिन पर्याप्त कठोरता प्रदान नहीं कर सकती है।

 let foo: any = 10; // All of these will throw errors, but TypeScript // won't complain since `foo` has the type `any`. foo.x.prop; foo.y.prop; foo.z.prop; foo(); new foo(); upperCase(foo); foo `hello world!`; function upperCase(x: string) { return x.toUpperCase(); }

कभी-कभी टाइपस्क्रिप्ट में आप एक प्रकार का वर्णन करना चाहते हैं जो किसी भी चीज के लिए उपयुक्त नहीं है। यह एक एपीआई के लिए उपयोगी है जो संकेत देना चाहता है: "यह किसी भी मूल्य का हो सकता है, इसलिए आपको इसका उपयोग करने से पहले कुछ जांच करने की आवश्यकता है।" और उपयोगकर्ताओं को सुरक्षा कारणों से रिटर्न मानों को पार्स करने के लिए मजबूर किया जाता है।

टाइपस्क्रिप्ट 3.0 अज्ञात नामक एक नए प्रकार का परिचय देता है, जो बस यही करता है। किसी भी प्रकार की तरह, अज्ञात प्रकार को किसी भी मूल्य को सौंपा गया है, हालांकि, किसी भी प्रकार के विपरीत, अज्ञात प्रकार को किसी भी प्रकार के बयान के बिना लगभग किसी अन्य को नहीं सौंपा जा सकता है। unknown, .

unknown any, foo :

 let foo: unknown = 10; // Since `foo` has type `unknown`, TypeScript // errors on each of these locations. foo.x.prop; foo.y.prop; foo.z.prop; foo(); new foo(); upperCase(foo); foo `hello world!`; function upperCase(x: string) { return x.toUpperCase(); }

, , , .

 let foo: unknown = 10; function hasXYZ(obj: any): obj is { x: any, y: any, z: any } { return !!obj && typeof obj === "object" && "x" in obj && "y" in obj && "z" in obj } // Using a user-defined type guard... if (hasXYZ(foo)) { // ...we're allowed to access certain properties again. foo.x.prop; foo.y.prop; foo.z.prop; } // We can also just convince TypeScript we know what we're doing // by using a type assertion. upperCase(foo as string); function upperCase(x: string) { return x.toUpperCase(); }

: , , , {} | null | undefined, unknown , :

 type Arrayify<T> = T extends any ? Array<T> : never; type A = Arrayify<{} | null | undefined>; // null[] | undefined[] | {}[] type B = Arrayify<unknown>; // unknown[]

defaultProps JSX

: .d.ts React , , .

- TypeScript/JavaScript , , . , . , .

 function loudlyGreet(name = "world") { // Thanks to the default initializer, `name` will always have type `string` internally. // We don't have to check for `undefined` here. console.log("HELLO", name.toUpperCase()); } // Externally, `name` is optional, and we can potentially pass `undefined` or omit it entirely. loudlyGreet(); loudlyGreet(undefined);

React (props). React , defaultProps, props.

 // Some non-TypeScript JSX file import * as React from "react"; import * as ReactDOM from "react-dom"; export class Greet extends React.Component { render() { const { name } = this.props; return <div>Hello ${name.toUpperCase()}!</div>; } static defaultProps = { name: "world", }; } // Notice no `name` attribute was specified! // vvvvvvvvv const result = ReactDOM.renderToString(<Greet />); console.log(result);

, <Greet /> name. Greet, name «world», : Hello world!.

, TypeScript , defaultProps - JSX. render:

 export interface Props { name?: string } export class Greet extends React.Component<Props> { render() { const { name } = this.props; // Notice the `!` ------v return <div>Hello ${name!.toUpperCase()}!</div>; } static defaultProps = { name: "world"} }

, .

TypeScript 3.0 JSX, LibraryManagedAttributes. , , TypeScript, JSX. , , React defaultProps , , propTypes.

 export interface Props { name: string } export class Greet extends React.Component<Props> { render() { const { name } = this.props; return <div>Hello ${name.toUpperCase()}!</div>; } static defaultProps = { name: "world"} } // Type-checks! No type assertions needed! let el = <Greet />

, . defaultProps, Partial , - (stateless function components, SFC), defaultProps Partial , . defaultProps (. ) SFC ES2015:

 function Greet({ name = "world" }: Props) { return <div>Hello ${name.toUpperCase()}!</div>; }

, . TypeScript, .d.ts DefinitelyTyped , , @types/react . DefinitelyTyped, .

/// <reference lib="..." />

, , , (polyfills) — , API , ( .d.ts), API. , TypeScript lib.d.ts , --lib --target. , core-js lib.es2015.d.ts.

TypeScript 3.0 , API, , : /// <reference lib="..." />.

, Promise ES2015

 /// <reference lib="es2015.promise" /> export {};

, TypeScript 3.0 , lib.es2015.promise.d.ts, , Promise .

, , TypeScript , . TypeScript JavaScript , Visual Studio, Visual Studio Code TypeScript. , , , Go to Definition (« ») . TypeScript 3.0 .

, , .

 import * as dependency from "./dependency"; // look at all this repetition! dependency.foo(); dependency.bar(); dependency.baz();

, , , , .

 import { foo, bar, baz } from "./dependency"; // way lower in the file... foo(); bar(); baz();

, , . TypeScript 3.0 , .

TypeScript , JSX:

JSX;
JSX.

TypeScript — , .

, API .

, TypeScript 3 , . , API .

unknown —

unknown — , , , .

API

LanguageService#getSourceFile , . . #24540 .
TypeChecker#getSymbolDisplayBuilder . . #25331 . emitter ( ) node builder.
escapeIdentifier unescapeIdentifier . API , . , , . escapeLeadingUnderscores unescapeLeadingUnderscores, , ( «» __String string ).
TypeChecker#getSuggestionForNonexistentProperty, TypeChecker#getSuggestionForNonexistentSymbol TypeChecker#getSuggestionForNonexistentModule , API. . #25520 .

संभावनाओं

TypeScript . , , , DefinitelyTyped , . , .

, TypeScript ( , ). , , JavaScript. , TypeScript, .

, , , , , Twitter . .

, TypeScript, ! . , , TypeScript , .

!
TypeScript

टाइपस्क्रिप्ट 3.0