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

জাভাস্ক্রিপ্ট মেথড: charAt() মেথড

জাভাস্ক্রিপ্টে একটি স্ট্রিং অবজেক্ট মেথড রয়েছে যা একটি স্ট্রিং-এ প্রদত্ত ইনডেক্সে কোন অক্ষর অবস্থিত তা জানতে সাহায্য করে। এই আর্টিকেলে সেই মেথড সম্পর্কে জানানো হবে এবং এর ব্যবহার দেখানো হবে।

প্রাথমিক টাইপস (Primitive Types)

জাভাস্ক্রিপ্টের প্রাথমিক টাইপগুলো কী? 'প্রাথমিক' (primitive) বলতে কী বোঝায়?

প্রাথমিক টাইপ বা মান হলো সেসব আইটেম যা অবজেক্ট নয় এবং যাদের সাথে কোনো মেথড যুক্ত নেই। জাভাস্ক্রিপ্টে প্রাথমিক টাইপগুলো হলো: string, number, boolean, bigint, symbol, এবং undefined। আজ আমরা স্ট্রিং প্রাথমিক মান (primitive string value) নিয়ে কাজ করব।

প্রাথমিক স্ট্রিং মানের অন্যতম বৈশিষ্ট্য হলো এটি সাধারণত প্রাথমিক স্ট্রিং অবজেক্টের সাথে পারস্পরিক বিনিময়যোগ্য। অধিকাংশ ক্ষেত্রে জাভাস্ক্রিপ্ট স্বয়ংক্রিয়ভাবে একটি প্রাথমিক স্ট্রিং-এর চারপাশে একটি প্রিমিটিভ স্ট্রিং অবজেক্ট র‍্যাপার (wrapper) লপেটে দেয় এবং স্ট্রিং মেথডের ব্যবহার বাধ্য করে। তাই অধিকাংশ ক্ষেত্রে আপনাকে প্রিমিটিভ স্ট্রিং (যার কোনো মেথড নেই) কে প্রিমিটিভ স্ট্রিং অবজেক্টে (যার মেথড রয়েছে) রূপান্তর করার চিন্তা করতে হয় না।

সিনট্যাক্স (Syntax)

String charAt() মেথডের সিনট্যাক্স খুব সহজ। আমরা যে স্ট্রিংটি পরীক্ষা করতে চাই उससे শুরু করি। যেহেতু এটি একটি স্ট্রিং অবজেক্ট, ডট নোটেশন (.) ব্যবহার করে মেথডটি অ্যাক্সেস করা হয় এবং এর শেষে প্যারেনথেসিস যোগ করে ইনডেক্স পাস করা হয়।

const charAtFive = new String("It is warm today.").charAt(5);

charAt() মেথডটি স্ট্রিং-এ সেই ইনডেক্সে অবস্থিত অক্ষরটি রিটার্ন করে। মনে রাখবেন স্ট্রিং শূন্য-ভিত্তিক (zero-based), অর্থাৎ ইনডেক্স ০ থেকে শুরু হয় এবং ক্রমাগত বাড়ে। নিচে একটি কাজ করা উদাহরণ দেওয়া হলো – ইনপুটে একটি স্ট্রিং এবং একটি ইনডেক্স দিয়ে সাবমিট করুন। যদি আপনি স্ট্রিং-এর দৈর্ঘ্যের বাইরে কোনো ইনডেক্স না চান, তবে আপনার চাওয়া ইনডেক্সে থাকা একক অক্ষরটি রিটার্ন করবে।

উদাহরণ কোড

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>charAt() Demo</title>
</head>
<body>
  <form onsubmit="handleSubmit(event)">
    <label for="input-string">একটি স্ট্রিং লিখুন:</label>
    <input id="input-string" onchange="handleChange(event)" type="text" name="inputVal" value=""/>
    <label for="input-index">একটি ইনডেক্স লিখুন:</label>
    <input id="input-index" onchange="handleChange(event)" type="text" name="numVal" value=""/>
    <input type="submit" value="Submit" />
  </form>
  <h3 id="root"></h3>
  <script>
    let inputVal = '';
    let numVal = '';
    let errorVal = '';
    const handleChange = e => {
      if(e.target.name === "inputVal") {
        inputVal = e.target.value;
      } else {
        if(inputVal.length - 1 < e.target.value || e.target.value < 0) {
          errorVal = "ইনডেক্স স্ট্রিং-এর দৈর্ঘ্যের চেয়ে কম এবং ০ বা তার বেশি হতে হবে";
        } else {
          errorVal = "";
          numVal = e.target.value;
        }
      }
    }
    const handleSubmit = e => {
      e.preventDefault();
      const root = document.querySelector("#root");
      if(errorVal) {
        root.innerHTML = errorVal;
      } else {
        root.innerHTML = new String(inputVal).charAt(Number(numVal));
      }
    }
  </script>
</body>
</html>

পরবর্তী কী শিখবেন?

  • জাভাস্ক্রিপ্ট রিভার্স স্ট্রিং কোড চ্যালেঞ্জ
  • জাভাস্ক্রিপ্ট Pop মেথড: এটি কী এবং কীভাবে ব্যবহার করবেন
  • জাভাস্ক্রিপ্টে Substring কীভাবে ব্যবহার করবেন
  • জাভাস্ক্রিপ্ট String Contains: ধাপে ধাপে গাইড
  • জাভাস্ক্রিপ্ট toUpperCase এবং toLowerCase
  1. জাভাস্ক্রিপ্ট অবজেক্ট মেথড

  2. জাভাস্ক্রিপ্ট Sort() মেথড

  3. জাভাস্ক্রিপ্টে String.trimStart() এবং String.trimEnd() মেথড ব্যাখ্যা

  4. জাভাস্ক্রিপ্টে মেথড শেয়ার করা