ইসমাস্ক্রিপ্ট im টি নতুন ধরণের স্ট্রিং আক্ষরিক সাথে ডেলিমিটার হিসাবে ব্যাকটিক ব্যবহার করে সামনে আসে। এই লিটারালগুলি বেসিক স্ট্রিং ইন্টারপোলেশন এক্সপ্রেশনগুলি এম্বেড করার অনুমতি দেয় যা পরে স্বয়ংক্রিয়ভাবে পার্স এবং মূল্যায়ন করা হয়।
let person = {name: 'RajiniKanth', age: 68, greeting: 'Thalaivaaaa!' };
let usualHtmlStr = "<p>My name is " + person.name + ",</p>\n" +
"<p>I am " + person.age + " old</p>\n" +
"<strong>\"" + person.greeting + "\" is what I usually say</strong>";
let newHtmlStr =
`<p>My name is ${person.name},</p>
<p>I am ${person.age} old</p>
<p>"${person.greeting}" is what I usually say</strong>`;
console.log(usualHtmlStr);
console.log(newHtmlStr);
আপনি দেখতে পাচ্ছেন, আমরা `
চারপাশে প্রায় কয়েকটি অক্ষর ব্যবহার করেছি, যা স্ট্রিং আক্ষরিক হিসাবে ব্যাখ্যা করা হয়, তবে ফর্মটির কোনও অভিব্যক্তি ${..}
পার্স করা এবং তাত্ক্ষণিকভাবে ইনলাইনে মূল্যায়ন করা হয়।
আন্তঃবিবাহিত স্ট্রিং আক্ষরিকাগুলির একটি দুর্দান্ত সুবিধা হ'ল এগুলি একাধিক লাইনে বিভক্ত হওয়ার অনুমতি রয়েছে:
var Actor = {"name": "RajiniKanth"};
var text =
`Now is the time for all good men like ${Actor.name}
to come to the aid of their
country!`;
console.log(text);
// Now is the time for all good men
// to come to the aid of their
// country!
আন্তঃবিবাহিত এক্সপ্রেশন
কোনও বৈধ অভিব্যক্তিটি ${..}
ফাংশন কল, ইনলাইন ফাংশন এক্সপ্রেশন কল এবং এমনকি অন্যান্য ইন্টারপোল্টেড স্ট্রিং আক্ষরিকাসহ একটি ইন্টারপোল্টেড স্ট্রিং আক্ষরিক অভ্যন্তরে উপস্থিত হওয়ার অনুমতি দেওয়া হয় !
function upper(s) {
return s.toUpperCase();
}
var who = "reader"
var text =
`A very ${upper("warm")} welcome
to all of you ${upper(`${who}s`)}!`;
console.log(text);
// A very WARM welcome
// to all of you READERS!
এখানে `${who}s`
স্ট্রিংয়ের who
সাথে ভেরিয়েবলের "s"
বিপরীতে সমন্বয় করার সময় অভ্যন্তরীণ ইন্টারপোল্টেড স্ট্রিং আক্ষরিকটি আমাদের জন্য কিছুটা সুন্দর সুবিধা ছিল who + "s"
। এছাড়াও একটি নোট রাখার জন্য একটি বিভক্ত স্ট্রিং আক্ষরিক কেবল বর্ণক্ষেত্রযুক্ত যেখানে এটি প্রদর্শিত হয়, কোনওভাবেই গতিশীলভাবে বাদ দেওয়া যায় না:
function foo(str) {
var name = "foo";
console.log(str);
}
function bar() {
var name = "bar";
foo(`Hello from ${name}!`);
}
var name = "global";
bar(); // "Hello from bar!"
এইচটিএমএলের জন্য টেম্পলেটটি আক্ষরিক ব্যবহার বিরক্তি হ্রাস করে অবশ্যই আরও পঠনযোগ্য।
সরল পুরানো উপায়:
'<div class="' + className + '">' +
'<p>' + content + '</p>' +
'<a href="' + link + '">Let\'s go</a>'
'</div>';
ECMAScript 6 সহ:
`<div class="${className}">
<p>${content}</p>
<a href="${link}">Let's go</a>
</div>`
- আপনার স্ট্রিং একাধিক লাইন বিস্তৃত করতে পারে।
- আপনার উদ্ধৃতি অক্ষরগুলি এড়ানোর দরকার নেই।
- আপনি যেমন গ্রুপিং এড়াতে পারেন: '">'
- আপনাকে প্লাস অপারেটর ব্যবহার করতে হবে না।
ট্যাগযুক্ত টেম্পলেট লিটারালস
আমরা একটি টেম্পলেট স্ট্রিং ট্যাগও করতে পারি, যখন একটি টেম্পলেট স্ট্রিং ট্যাগ করা হয়, তখন আক্ষরিক এবং প্রতিস্থাপনগুলি ফাংশনে পাস করা হয় যা ফলাফলের মানটি দেয়।
function myTaggedLiteral(strings) {
console.log(strings);
}
myTaggedLiteral`test`; //["test"]
function myTaggedLiteral(strings, value, value2) {
console.log(strings, value, value2);
}
let someText = 'Neat';
myTaggedLiteral`test ${someText} ${2 + 3}`;
//["test", ""]
// "Neat"
// 5
আমরা একাধিক মান পাস করতে এখানে স্প্রেড অপারেটরটি ব্যবহার করতে পারি। প্রথম যুক্তি — আমরা একে স্ট্রিংস বলেছি all সমস্ত সরল স্ট্রিংগুলির বিন্যাস (কোনও বিভাজনযুক্ত এক্সপ্রেশনগুলির মধ্যে স্টাফ)।
আমরা তখন পর্যন্ত পরবর্তী সব আর্গুমেন্ট একটি অ্যারের নামের বস্তু ব্যবহার মান জড়ো ... gather/rest operator
, যদিও আপনি অবশ্যই পারা তাদের প্যারামিটার মত আমরা উপরোক্ত করেনি স্ট্রিং (নিম্নলিখিত ব্যক্তির নাম পরামিতি হিসেবে বাকি আছে value1
, value2
ইত্যাদি)।
function myTaggedLiteral(strings, ...values) {
console.log(strings);
console.log(values);
}
let someText = 'Neat';
myTaggedLiteral`test ${someText} ${2 + 3}`;
//["test", ""]
// "Neat"
// 5
আমাদের মান অ্যারেতে যুক্ত আর্গুমেন্টগুলি হ'ল স্ট্রিং ল্যাটারিয়ালটিতে ইতিমধ্যে মূল্যায়ন করা ইন্টারপোলেশন এক্সপ্রেশনগুলির ফলাফল। একটি ট্যাগযুক্ত স্ট্রিং আক্ষরিক হ'ল বিভাজনগুলি মূল্যায়নের পরে প্রক্রিয়াজাতকরণের ধাপের মতো, তবে চূড়ান্ত স্ট্রিংয়ের মানটি সংকলিত হওয়ার আগে, আপনাকে আক্ষরিক থেকে স্ট্রিং তৈরি করতে আরও নিয়ন্ত্রণের সুযোগ দেয়। আসুন পুনরায় ব্যবহারযোগ্য টেমপ্লেট তৈরির উদাহরণ দেখুন।
const Actor = {
name: "RajiniKanth",
store: "Landmark"
}
const ActorTemplate = templater`<article>
<h3>${'name'} is a Actor</h3>
<p>You can find his movies at ${'store'}.</p>
</article>`;
function templater(strings, ...keys) {
return function(data) {
let temp = strings.slice();
keys.forEach((key, i) => {
temp[i] = temp[i] + data[key];
});
return temp.join('');
}
};
const myTemplate = ActorTemplate(Actor);
console.log(myTemplate);
কাঁচা স্ট্রিংস
আমাদের ট্যাগ ফাংশনগুলি প্রথম যুক্তি পায় যা আমরা স্ট্রিং নামে পরিচিত যা একটি অ্যারে। তবে এতে অতিরিক্ত পরিমাণে ডেটা অন্তর্ভুক্ত রয়েছে: সমস্ত স্ট্রিংয়ের কাঁচা অপ্রয়োজনীয় সংস্করণ। আপনি .raw
সম্পত্তি ব্যবহার করে এই কাঁচা স্ট্রিংয়ের মানগুলি অ্যাক্সেস করতে পারেন :
function showraw(strings, ...values) {
console.log(strings);
console.log(strings.raw);
}
showraw`Hello\nWorld`;
আপনি দেখতে পাচ্ছেন, স্ট্রিংয়ের কাঁচা সংস্করণটি পালিয়ে যাওয়া \n
ক্রমটি সংরক্ষণ করে , যখন স্ট্রিংটির প্রক্রিয়াজাত সংস্করণ এটিকে একটি অবিরত আসল নতুন লাইনের মতো আচরণ করে। এর নাম ECMAScript 6 একটি বিল্ট-ইন ফাংশন যা একটি স্ট্রিং আক্ষরিক ট্যাগ হিসেবে ব্যবহার করা যাবে সাথে আসে: String.raw(..)
। এটি কেবল স্ট্রিংয়ের কাঁচা সংস্করণ দিয়ে যায়:
console.log(`Hello\nWorld`);
/* "Hello
World" */
console.log(String.raw`Hello\nWorld`);
// "Hello\nWorld"