কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে টেমপ্লেট স্ট্রিংস

টেমপ্লেট লিটারেলস (Template Strings)

ES6-এ টেমপ্লেট স্ট্রিংস আসে যা ব্যাকটিক (``) ব্যবহার করে। এক্সপ্রেশন এমবেড করতে `${expression}` সিনট্যাক্স ব্যবহার করা হয়। এটি স্ট্রিং ইন্টারপোলেশনের জন্য অনেক বেটার সিনট্যাক্স।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
        body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; }
        .result { font-size: 20px; font-weight: 500; color: blueviolet; }
    </style>
</head>
<body>
    <h1>জাভাস্ক্রিপ্টে টেমপ্লেট স্ট্রিংস</h1>
    <div class="result"></div>
    <button class="Btn">এখানে ক্লিক করুন</button>
    <h3>উপরোক্ত বাটনে ক্লিক করুন দুটি সংখ্যা যোগ করে দেখাতে</h3>
    <script>
        let resEle = document.querySelector(".result");
        let a = 22;
        let b = 44;
        function add(a, b) {
            return a + b;
        }
        document.querySelector(".Btn").addEventListener("click", () => {
            resEle.innerHTML = `The sum of ${a} and ${b} = ${add(a, b)}`;
        });
    </script>
</body>
</html>

আউটপুট

বাটনে ক্লিক করলে "The sum of 22 and 44 = 66" টেমপ্লেট স্ট্রিং ব্যবহার করে দেখাবে।

  1. জাভাস্ক্রিপ্টে টেমপ্লেট স্ট্রিং দিয়ে ফরম্যাটেড স্ট্রিং

  2. জাভাস্ক্রিপ্টে নেস্টেড টেমপ্লেট স্ট্রিং

  3. জাভাস্ক্রিপ্টে ট্যাগড টেমপ্লেট লিটারেল

  4. জাভাস্ক্রিপ্টে আইসোমорফিক স্ট্রিং নির্ধারণ