আপনি কিভাবে জাভাস্ক্রিপ্টে একটি স্ট্রিং ফর্ম্যাট করবেন?

জাভাস্ক্রিপ্টে, একটি স্ট্রিং হল অক্ষরের একটি গ্রুপ যা হয় এক জোড়া বা দ্বিগুণ উদ্ধৃতি চিহ্ন দ্বারা আবদ্ধ। জাভাস্ক্রিপ্টে স্ট্রিং ফরম্যাট করার অনেক উপায় আছে।

স্ট্রিং একত্রিত করতে আপনি নির্দিষ্ট পদ্ধতি বা অপারেটর ব্যবহার করতে পারেন। কোন স্ট্রিং কোথায় এবং কখন প্রদর্শিত হবে তা নির্ধারণ করতে আপনি নির্দিষ্ট অপারেশনগুলিও করতে পারেন।

কিভাবে অ্যাডোব ইলাস্ট্রেটারে টেক্সট বক্র করা যায়

দিনের মেকইউজের ভিডিও

কনক্যাটেনেশন পদ্ধতি এবং টেমপ্লেট লিটারেল ব্যবহার করে আপনার জাভাস্ক্রিপ্ট স্ট্রিংগুলি কীভাবে ফর্ম্যাট করবেন তা শিখুন।

স্ট্রিং সংযোগ

জাভাস্ক্রিপ্ট আপনাকে বিভিন্ন পন্থা ব্যবহার করে স্ট্রিং সংযুক্ত করতে দেয়। একটি দরকারী পদ্ধতি হল concat() পদ্ধতি এই পদ্ধতিতে দুই বা ততোধিক স্ট্রিং ব্যবহার করা হয়। এটি একটি একক কলিং স্ট্রিং ব্যবহার করে এবং আর্গুমেন্ট হিসাবে এক বা একাধিক স্ট্রিং নেয়।

const firstName = "John"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName.concat(" ", lastName); 
console.log(stringVal);

এখানে, concat কলিং স্ট্রিং (firstName) এর সাথে স্ট্রিং আর্গুমেন্ট (একটি ফাঁকা স্থান এবং শেষ নাম) যোগ করে। কোড তারপর একটি পরিবর্তনশীল (stringVal) এবং এর ফলে নতুন স্ট্রিং সংরক্ষণ করে ব্রাউজার কনসোলে নতুন মান প্রিন্ট করে :

প্লাস অপারেটর ব্যবহার করে স্ট্রিংগুলির একটি সংগ্রহকে সংযুক্ত করার আরেকটি উপায়। এই পদ্ধতিটি আপনাকে নতুন স্ট্রিং তৈরি করতে স্ট্রিং ভেরিয়েবল এবং স্ট্রিং লিটারেলকে একত্রিত করতে দেয়।

const firstName = "John"; 
const middleName = "Mike"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName + " " + middleName + " " + lastName; 
console.log(stringVal);

উপরের কোডটি কনসোলে নিম্নলিখিত আউটপুট প্রিন্ট করে:

আপনার জাভাস্ক্রিপ্ট স্ট্রিংগুলিকে সংযুক্ত করার তৃতীয় পদ্ধতির জন্য একটি প্লাস এবং সমান চিহ্ন ব্যবহার করা প্রয়োজন। এই পদ্ধতিটি আপনাকে বিদ্যমান একটির শেষে একটি নতুন স্ট্রিং যুক্ত করতে দেয়।

const firstName = "John"; 
const lastName = "Doe"; 
  
let stringVal; 
  
stringVal = firstName; 
stringVal += " "; 
stringVal += lastName; 
  
console.log(stringVal);

এই কোডটি একটি ফাঁকা স্থান এবং lastName ভেরিয়েবলের মান firstName ভেরিয়েবলের সাথে যুক্ত করে, যা নিম্নলিখিত আউটপুট তৈরি করে:

একটি ইউএসবিতে উইন্ডোজ কিভাবে ইনস্টল করবেন

টেমপ্লেট আক্ষরিক

টেমপ্লেট লিটারালগুলি হল একটি ES6 বৈশিষ্ট্য যা আপনাকে জাভাস্ক্রিপ্ট স্ট্রিংগুলি ফর্ম্যাট করতে দেয়৷ একটি টেমপ্লেট আক্ষরিক স্ট্রিং প্রদর্শন করতে ব্যাকটিক্স (`) এর জোড়া ব্যবহার করে। স্ট্রিং বিন্যাসের এই পদ্ধতিটি আপনাকে জাভাস্ক্রিপ্টে ক্লিনার মাল্টিলাইন স্ট্রিংগুলি প্রদর্শন করতে দেয়।

let html; 
  
html = `<ul> 
       <li> Name: John Doe </li> 
       <li> Age: 24 </li> 
       <li> Job: Software Engineer </li> 
       </ul>`; 
  
document.body.innerHTML = html;

উপরের জাভাস্ক্রিপ্ট কোডটি ব্যবহার করে এইচটিএমএল ব্রাউজারে তিনটি আইটেমের একটি তালিকা প্রিন্ট করতে:

টেমপ্লেট লিটারাল ছাড়া একই আউটপুট অর্জন করতে (বা টেমপ্লেট লিটারালের আগে), আপনাকে উদ্ধৃতি চিহ্ন ব্যবহার করতে হবে। যাইহোক, আপনি টেমপ্লেট লিটারেলগুলির সাথে যতটা পারেন কোডটিকে একাধিক লাইনে প্রসারিত করতে সক্ষম হবেন না।

let html; 
  
html = "<ul><li>Name: John Doe</li><li>Age: 24</li><li>Job: Software Engineer</li></ul>"; 
  
document.body.innerHTML = html;

স্ট্রিং ইন্টারপোলেশন

টেমপ্লেট লিটারেল আপনাকে ইন্টারপোলেশন নামক একটি প্রক্রিয়ার মাধ্যমে আপনার জাভাস্ক্রিপ্ট স্ট্রিংগুলিতে এক্সপ্রেশন ব্যবহার করতে দেয়। স্ট্রিং ইন্টারপোলেশনের সাহায্যে আপনি ব্যবহার করে আপনার স্ট্রিংগুলিতে এক্সপ্রেশন বা ভেরিয়েবল এম্বেড করতে পারেন ${expression} স্থানধারক এখানেই জাভাস্ক্রিপ্ট টেমপ্লেট লিটারালের মান সত্যিই স্পষ্ট হয়ে ওঠে।

কিভাবে অ্যান্ড্রয়েড ব্যাটারি স্বাস্থ্য পরীক্ষা করবেন

let userName = "Jane Doe"; 
let age = 21; 
let job = "Web Developer"; 
let experience = 3; 
  
let html; 
  
html = `<ul> 
       <li> Name: ${userName} </li> 
       <li> Age: ${age} </li> 
       <li> Job Title: ${job} </li> 
       <li> Years of Experience: ${experience} </li> 
       <li> Developer Level: ${experience < 5 ? "Junior to Intermediate" : "Senior"} </li> 
       </ul>`; 
  
document.body.innerHTML = html;

উপরের কোডটি কনসোলে নিম্নলিখিত আউটপুট তৈরি করে:

এর প্রথম চারটি যুক্তি ${expression} স্থানধারক হল স্ট্রিং ভেরিয়েবল, কিন্তু পঞ্চমটি একটি শর্তসাপেক্ষ অভিব্যক্তি। এক্সপ্রেশনটি একটি ভেরিয়েবলের (অভিজ্ঞতা) মানের উপর নির্ভর করে, এটি ব্রাউজারে কী প্রদর্শন করা উচিত তা নির্দেশ করতে।

জাভাস্ক্রিপ্টের সাহায্যে আপনার ওয়েবপৃষ্ঠায় উপাদানগুলি বিন্যাস করা

ওয়েবপেজ ডেভেলপমেন্টের সাথে এর কার্যকরী অ্যাসোসিয়েশন ছাড়াও, জাভাস্ক্রিপ্ট একটি ওয়েবপেজের ডিজাইন এবং লেআউটকে প্রভাবিত করতে HTML এর সাথে কাজ করে। এটি টেমপ্লেট লিটারালের ক্ষেত্রে যেমন একটি ওয়েবপৃষ্ঠায় প্রদর্শিত পাঠ্যকে ম্যানিপুলেট করতে পারে।

এটি এমনকি এইচটিএমএলকে ইমেজে রূপান্তর করতে পারে এবং একটি ওয়েবপেজে প্রদর্শন করতে পারে।