मुझे यकीन नहीं है कि मैं इसे कैसे समझाऊं, लेकिन जब मैं दौड़ता हूं
console.log`1`
Google क्रोम में, मुझे आउटपुट मिलता है
console.log`1`
VM12380:2 ["1", raw: Array[1]]
बैकटिक लॉग फ़ंक्शन को कॉल क्यों कर रहा है, और यह एक इंडेक्स क्यों बना रहा है raw: Array[1]?
प्रश्न Catgocat द्वारा जे एस कक्ष में लाया है, लेकिन कोई जवाब के बारे में कुछ के अलावा भावना बनाया तार templating कि वास्तव में फिट नहीं क्यों यह हो रहा है।
जवाबों:
इसे ES-6 में टैग किया गया टेम्प्लेट कहा जाता है , उनके बारे में अधिक पढ़ा जा सकता है यहां , अजीब बात है कि मुझे बहुत चैट के तारांकित खंड में लिंक मिला।
लेकिन कोड का प्रासंगिक हिस्सा नीचे है (आप मूल रूप से फ़िल्टर किए गए प्रकार बना सकते हैं)।
function tag(strings, ...values) {
assert(strings[0] === 'a');
assert(strings[1] === 'b');
assert(values[0] === 42);
return 'whatever';
}
tag `a${ 42 }b` // "whatever"
मूल रूप से, यह केवल "1" को सांत्वना.लॉग फ़ंक्शन के साथ टैग करता है, क्योंकि यह किसी अन्य फ़ंक्शन के साथ करेगा। टैगिंग फ़ंक्शन टेम्प्लेट स्ट्रिंग्स के पार्स किए गए मानों और उन मानों को अलग-अलग स्वीकार करते हैं जिन पर आगे कार्य किए जा सकते हैं।
बाबेल उपरोक्त कोड को ट्रांसप्लस करता है
var _taggedTemplateLiteralLoose = function (strings, raw) { strings.raw = raw; return strings; };
console.log(_taggedTemplateLiteralLoose(["1"], ["1"]));
जैसा कि आप ऊपर दिए गए उदाहरण में देख सकते हैं, बैबेल द्वारा ट्रांसप्लड किए जाने के बाद, टैगिंग फ़ंक्शन (कंसोल.लॉग) को निम्नलिखित es6-> 5 ट्रांसप्लड कोड का रिटर्न मान पारित किया जा रहा है।
_taggedTemplateLiteralLoose( ["1"], ["1"] );
इस फ़ंक्शन का रिटर्न मान कंसोल.लॉग को दिया जाता है जो तब सरणी को प्रिंट करेगा।
निम्नलिखित सिंटैक्स:
function`your template ${foo}`;
को टैगेड टेम्प्लेट शाब्दिक कहा जाता है ।
फ़ंक्शन को टैग किए गए टेम्प्लेट शाब्दिक के रूप में कहा जाता है, निम्न तरीके से अपने तर्क प्राप्त करता है:
function taggedTemplate(strings, arg1, arg2, arg3, arg4) {
console.log(strings);
console.log(arg1, arg2, arg3, arg4);
}
taggedTemplate`a${1}b${2}c${3}`;arg4(क्योंकि केवल 3 बार स्ट्रिंग प्रक्षेप हैं) और इस प्रकार undefinedलॉग किया जाता है जब हम लॉग इन करने का प्रयास करते हैंarg4यदि हम पहले से नहीं जानते हैं कि स्ट्रिंग स्ट्रिंग में कितनी बार स्ट्रिंग प्रक्षेप होगा, तो यह अक्सर बाकी पैरामीटर सिंटैक्स का उपयोग करने के लिए उपयोगी होता है। यह सिंटैक्स शेष तर्कों को संग्रहीत करता है जो फ़ंक्शन एक सरणी में प्राप्त करता है। उदाहरण के लिए:
function taggedTemplate(strings, ...rest) {
console.log(rest);
}
taggedTemplate `a${1}b${2}c${3}`;
taggedTemplate `a${1}b${2}c${3}d${4}`;पार्टी में देर से लेकिन, टीबीएच, कोई भी उत्तर मूल प्रश्न के 50% ("क्यों raw: Array[1]") का स्पष्टीकरण देता है
console.log`1`
जैसा कि अन्य लोगों ने बताया है, इसे टैग्ड टेम्प्लेट कहा जाता है (अधिक विवरण भी यहां )।
इस सिंटैक्स का उपयोग करते हुए, फ़ंक्शन को निम्न तर्क प्राप्त होंगे:
मूल रूप से, निम्नलिखित 'लगभग' समकक्ष हैं :
// Tagged Template
fn`My uncle ${uncleName} is ${uncleAge} years old!`
// function call
fn(["My uncle ", " is ", " years old!"], uncleName, uncleAge);
(बिंदु 2 देखें। यह समझने के लिए कि वे समान क्यों नहीं हैं)
["1", raw: Array[1]]???सरणी को पहले तर्क के रूप में पारित किया जा रहा है raw, जिसमें एक संपत्ति है , जो कच्चे तार को एक्सेस करने की अनुमति देता है क्योंकि वे दर्ज किए गए थे (प्रसंस्करण से बचने के अनुक्रम के बिना)।
उदाहरण उपयोग मामला:
let fileName = "asdf";
fn`In the folder C:\Documents\Foo, create a new file ${fileName}`
function fn(a, ...rest) {
console.log(a); //In the folder C:DocumentsFoo, create a new file
console.log(a.raw); //In the folder C:\Documents\Foo, create a new file
}
क्या, एक संपत्ति के साथ एक सरणी ??? ???
हां, चूंकि जावास्क्रिप्ट सरणियां वास्तव में ऑब्जेक्ट हैं, इसलिए वे गुणों को संग्रहीत कर सकते हैं ।
उदाहरण:
const arr = [1, 2, 3];
arr.property = "value";
console.log(arr); //[1, 2, 3, property: "value"]