जावास्क्रिप्ट टेम्पलेट साहित्य (टेम्पलेट स्ट्रिंग्स)

इस ट्यूटोरियल में, आप उदाहरणों की सहायता से जावास्क्रिप्ट टेम्प्लेट लिटरल्स (टेम्पलेट स्ट्रिंग्स) के बारे में जानेंगे।

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

 const name = 'Jack'; console.log(`Hello $(name)!`); // Hello Jack!

नोट : टेम्पलेट शाब्दिक 2015 में प्रस्तुत किया गया था (जिसे ECMAScript 6 या ES6 या ECMAScript 2015 के रूप में भी जाना जाता है)। कुछ ब्राउज़र टेम्पलेट शाब्दिक के उपयोग का समर्थन नहीं कर सकते हैं। अधिक जानने के लिए जावास्क्रिप्ट टेम्पलेट लिटरल सपोर्ट पर जाएँ।

स्ट्रिंग्स के लिए टेम्पलेट साहित्य

जावास्क्रिप्ट के पुराने संस्करणों में, आप एकल उद्धरण ''या ""स्ट्रिंग्स के लिए एक डबल उद्धरण का उपयोग करेंगे । उदाहरण के लिए,

 const str1 = 'This is a string'; // cannot use the same quotes const str2 = 'A "quote" inside a string'; // valid code const str3 = 'A 'quote' inside a string'; // Error const str4 = "Another 'quote' inside a string"; // valid code const str5 = "Another "quote" inside a string"; // Error

स्ट्रिंग के अंदर समान कोटेशन का उपयोग करने के लिए, आप एस्केप कैरेक्टर का उपयोग कर सकते हैं

 // escape characters using const str3 = 'A \'quote\' inside a string'; // valid code const str5 = "Another "quote " inside a string"; // valid code

भागने के पात्रों का उपयोग करने के बजाय, आप टेम्पलेट शाब्दिक का उपयोग कर सकते हैं। उदाहरण के लिए,

 const str1 = `This is a string`; const str2 = `This is a string with a 'quote' in it`; const str3 = `This is a string with a "double quote" in it`;

जैसा कि आप देख सकते हैं, टेम्पलेट शाब्दिक न केवल उद्धरणों को शामिल करना आसान बनाते हैं, बल्कि हमारे कोड को भी साफ करते हैं।

टेम्प्लेट साहित्य का उपयोग कर बहुस्तरीय स्ट्रिंग्स

टेम्पलेट शाब्दिक भी मल्टीलाइन स्ट्रिंग्स को लिखना आसान बनाते हैं। उदाहरण के लिए,

टेम्पलेट शाब्दिक का उपयोग करके, आप प्रतिस्थापित कर सकते हैं

 // using the + operator const message1 = 'This is a long message' + 'that spans across multiple lines' + 'in the code.' console.log(message1)

साथ से

 const message1 = `This is a long message that spans across multiple lines in the code.` console.log(message1)

इन दोनों कार्यक्रमों का आउटपुट समान होगा।

 यह एक लंबा संदेश है जो कोड में कई लाइनों में फैला हुआ है।

अभिव्यक्ति अंतर्वेशन

जावास्क्रिप्ट ईएस 6 से पहले, आप +ऑपरेटर को स्ट्रिंग में अभिव्यक्तियों और अभिव्यक्तियों को संक्षिप्त करने के लिए उपयोग करेंगे । उदाहरण के लिए,

 const name = 'Jack'; console.log('Hello ' + name); // Hello Jack

टेम्पलेट शाब्दिक के साथ, एक स्ट्रिंग के अंदर चर और भावों को शामिल करना थोड़ा आसान है। उसके लिए, हम $(… )सिंटैक्स का उपयोग करते हैं।

 const name = 'Jack'; console.log(`Hello $(name)`); // template literals used with expressions const result = `The sum of 4 + 5 is $(4 + 5)`; console.log(result); console.log(`$(result < 10 ? 'Too low': 'Very high')`)

आउटपुट

 हैलो जैक 4 + 5 का योग 9 बहुत अधिक है

टेम्प्लेट शाब्दिक के अंदर चर और भावों को निर्दिष्ट करने की प्रक्रिया को प्रक्षेप के रूप में जाना जाता है।

टैग किए गए टेम्पलेट

आम तौर पर, आप तर्कों को पारित करने के लिए एक फ़ंक्शन का उपयोग करेंगे। उदाहरण के लिए,

 function tagExample(strings) ( return strings; ) // passing argument const result = tagExample('Hello Jack'); console.log(result);

हालाँकि, आप टेम्प्लेट शाब्दिकों का उपयोग करके टैग किए गए टेम्प्लेट (जो एक फ़ंक्शन की तरह व्यवहार करते हैं) बना सकते हैं। आप उन टैगों का उपयोग करते हैं जो आपको फ़ंक्शन के साथ टेम्पलेट शाब्दिकता को पार्स करने की अनुमति देते हैं।

टैग किए गए टेम्पलेट को फ़ंक्शन परिभाषा की तरह लिखा जाता है। हालाँकि, आप ()शाब्दिक कॉल करते समय कोष्ठक पास नहीं करते हैं । उदाहरण के लिए,

 function tagExample(strings) ( return strings; ) // creating tagged template const result = tagExample`Hello Jack`; console.log(result);

आउटपुट

 ("नमस्ते जैक")

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

 const name = 'Jack'; const greet = true; function tagExample(strings, nameValue) ( let str0 = strings(0); // Hello let str1 = strings(1); // , How are you? if(greet) ( return `$(str0)$(nameValue)$(str1)`; ) ) // creating tagged literal // passing argument name const result = tagExample`Hello $(name), How are you?`; console.log(result);

आउटपुट

 हैलो जैक, आप कैसे हैं?

इस तरह, आप टैग किए गए टेंपलेट में कई तर्क भी पास कर सकते हैं।

दिलचस्प लेख...