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

JavaScript Class: একটি গাইড

জাভাস্ক্রিপ্ট প্রোটোটাইপ-ভিত্তিক। প্রতিবার আপনি একটি অবজেক্ট ঘোষণা করলে, একটি প্রোটোটাইপ প্রোপার্টি তৈরি হয় যা সেই অবজেক্টের সাথে যুক্ত প্রোপার্টি এবং মেথডগুলকে এক্সটেন্ড করে।

গত кіль سالে, অনেক জাভাস্ক্রিপ্ট ডেভেলপার তাদের কোডে অবজেক্ট-ওরিয়েন্টেড ডিজাইন অন্তর্ভুক্ত করার উপায় খুঁজে পেয়েছেন। এটি জাভাস্ক্রিপ্টে ক্লাস নামে একটি নতুন টাইপের অবজেক্টের উদ্ভব করেছে, যা একটি প্রোটোটাইপকে এক্সটেন্ড করে।

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

JavaScript Class কী?

ক্লাস হল একটি অবজেক্টের জন্য টেমপ্লেট ঘোষণা করার একটি পদ্ধতি।

আপনি অবজেক্ট-ওরিয়েন্টেড প্রোগ্রামিং ল্যাঙ্গুয়েজের সাথে পরিচিত থাকলে, আপনি জানবেন যে সেগুলো ক্লাস এবং অবজেক্টের ওপর ভরসা করে। একটি ক্লাস হল একটি ডেটা টাইপের ব্লুপ্রিন্ট: এটি বলে যে কী ডেটা সংরক্ষণ করা যাবে এবং কী মেথডগুলো অ্যাক্সেস করা যাবে। একটি অবজেক্ট হল সেই ক্লাসের একটি উদাহরণ।

একটি ক্লাসের উদাহরণ হবে Book। এই ক্লাসে বইয়ের উপরে কী ইনফরমেশন সংরক্ষণ করা যাবে এবং সেই ডেটা কীভাবে পরিবর্তন করা যাবে তার ব্লুপ্রিন্ট থাকবে। একটি অবজেক্ট হতে পারে A Streetcar Named Desire, যা একটি পৃথক বই।

জাভাস্ক্রিপ্টে, ক্লাসগুলো হল যা আমরা সিনট্যাক্টিক সুগার বলি। ক্লাস সিনট্যাক্স থাকা ভালো, কিন্তু তারা বাধ্যতামূলকভাবে কোনো নতুন ফাংশন্যালিটি যোগ করে না।

ক্লাসগুলো আধুনিক জাভাস্ক্রিপ্ট ফ্রেমওয়ার্কগুলোতে যেমন React এবং Next.js-এ সাধারণত ব্যবহৃত হয়।

Classes vs. Functions

এই আর্টিকেল থেকে একটা জিনিস মনে রাখলেই হবে: ক্লাসগুলো শুধু নরমাল ফাংশন।

একটি ক্লাস এবং একটি ফাংশন এক্সপ্রেশনের একমাত্র পার্থক্য হলো সেগুলো কীভাবে ঘোষণা করা হয়; ফাংশন function কীওয়ার্ড ব্যবহার করে এবং ক্লাস class কীওয়ার্ড ব্যবহার করে। টেকনিক্যালি, আপনি class কীওয়ার্ড ব্যবহার না করেই একটি ক্লাস ঘোষণা করতে পারেন।

আমরা দুটি ফাংশন তৈরি করে এবং তাদের প্রোটোটাইপ প্রিন্ট করে বোঝতে পারি যে তারা একই:

const PlayerFunction = function() {} const PlayerClass = class {} console.log(Object.getPrototypeOf(PlayerFunction)); console.log(Object.getPrototypeOf(PlayerClass)); 

আমাদের ক্লাস এক্সপ্রেশন এবং ফাংশন রিটার্ন করে:

function ()

function ()

আমাদের ফাংশন এবং ক্লাস দুটোই একই প্রোটোটাইপ-ভিত্তিক আর্কিটেকচার ব্যবহার করে।

Class কীভাবে ডিফাইন করবেন

কীভাবে ক্লাস ডিফাইন করবেন? সেটা একটি ভালো প্রশ্ন।

আপনি class কীওয়ার্ড ব্যবহার করে একটি ক্লাস ডিফাইন করতে পারেন। একবার আপনি ক্লাস ডিফাইন করলে, আপনি কনস্ট্রাক्टर() ফাংশন ব্যবহার করে কিছু ডিফল্ট ভ্যালু দিয়ে এটি আরম্ভ করতে পারেন।

একটি জাভাস্ক্রিপ্ট কনসোল খুলুন এবং এই কোড পেস্ট করুন:

 class Book { constructor(title, author) { this.title = title; this.author = author; } } 

এটি Book নামে একটি ক্লাস তৈরি করে। আমাদের ক্লাস দুটি ভ্যালু সংরক্ষণ করতে পারে, title এবং author, যা আমরা আমাদের ক্লাস কনস্ট্রাক্টর মেথডে সংজ্ঞায়িত করেছি। এই ক্লাসের একটি অবজেক্ট তৈরি করতে আমরা এই কোড ব্যবহার করতে পারি:

var streetcar = new Book("A Streetcar Named Desire", "Tennessee Williams"); 

আমরা আমাদের ক্লাস থেকে ভ্যালু রিট্রিভ করতে পারি যেভাবে যেকোনো অবজেক্ট থেকে করি:

console.log(streetcar.title); 

আমাদের কোড রিটার্ন করে: A Streetcar Named Desire।

Class মেথড কীভাবে ডিফাইন করবেন

প্রোটোটাইপের চেয়ে ক্লাস ব্যবহার করার একটি সুবিধা হলো আপনি একটি ক্লাসের ভেতরে মেথড ঘোষণা করতে পারেন। এর মানে আপনাকে একটি এক্সিস্টিং ফাংশনে নতুন মেথড যোগ করতে prototype সিনট্যাক্স ব্যবহার করতে হবে না।

এই উদাহরণটি বিবেচনা করুন:

class Book { constructor(title, author) { this.title = title; this.author = author; } getDetails() { console.log(`${this.title} is a book written by ${this.author}.`); } } 

আমরা getDetails() নামে একটি মেথড ঘোষণা করেছি যা আমাদের ক্লাসের ভেতরে এক্সিস্ট করে। এটি ভালো কারণ এটি আমাদের সব কোড একসাথে রাখে। আমাদের getDetails() ফাংশন কল করি:

var streetcar = new Book("A Streetcar Named Desire", "Tennessee Williams"); streetcar.getDetails(); 

আমাদের কোড রিটার্ন করে:

A Streetcar Named Desire is a book written by Tennessee Williams.

ক্লাস ইনহেরিট করা

যেকোনো অবজেক্ট-ওরিয়েন্টেড স্ট্রাকচারের মতো, ক্লাস অন্য ক্লাস থেকে প্রোপার্টি ইনহেরিট করতে পারে।

ইনহেরিটেন্স হল একটি প্রসেস যেখানে একটি চাইল্ড ক্লাস পেরেন্ট ক্লাস থেকে মেথড এবং ডেটা অ্যাক্সেস করতে পারে। একটি ক্লাস ইনহেরিট করতে, আপনি extends কীওয়ার্ড ব্যবহার করতে পারেন। একটি জাভাস্ক্রিপ্ট ফাইল তৈরি করুন বা আপনার জাভাস্ক্রিপ্ট কনসোল খুলুন এবং এই কোড পেস্ট করুন:

class Fiction extends Book { constructor(title, author, fiction) { super(title, author); this.fiction = true; } } 

আমরা Fiction নামে একটি ক্লাস তৈরি করেছি যা আমরা আগে ঘোষণা করা Book ক্লাসকে ব্লুপ্রিন্ট হিসেবে ব্যবহার করে। আমাদের কোডে, আমরা super() কীওয়ার্ড ব্যবহার করেছি পেরেন্ট ক্লাস থেকে title এবং author ভ্যালু ইনহেরিট করতে, যা Book। তারপর, আমরা একটি নতুন অ্যাট্রিবিউট সংজ্ঞায়িত করেছি, fiction, যার ডিফল্ট ভ্যালু true।

আমাদের নতুন Fiction ক্লাসের একটি অবজেক্ট তৈরি করি:

var gatsby = new Fiction("The Great Gatsby", "F. Scott Fitzgerald"); console.log(gatsby.fiction); 

আমাদের কোড রিটার্ন করে: true। Fiction ক্লাস fiction নামে একটি আইটেম সংরক্ষণ করে যা ডিফল্টভাবে true। যদি আমরা Book ক্লাসের একটি উদাহরণ থেকে এই মান অ্যাক্সেস করার চেষ্টা করি, কিছুই রিটার্ন হবে না। কারণ "fiction" শুধু আমাদের Fiction ক্লাসে অ্যাক্সেসযোগ্য।

Getters এবং Setters

যখন আপনি ক্লাসসহ কাজ করছেন, আপনাকে গেটার এবং সেটার ফাংশনগুলো ব্যবহার করা উচিত।

গেটার ফাংশন আপনাকে ক্লাস থেকে মেথড রিট্রিভ করতে দেয়। সেটার ফাংশন আপনাকে ক্লাসের একটি নির্দিষ্ট আইটেমের ভ্যালু পরিবর্তন করতে দেয়। এই ফাংশনগুলো get এবং set কীওয়ার্ডসহ ডেনোট করা হয়।

নিচের কোড বিবেচনা করুন:

class Book { constructor(title, author) { this.title = title; this.author = author; } get author() { return this.author; } set author(author) { this.author = author; } } 

এই উদাহরণে, আমরা author নামে দুটি মেথড ঘোষণা করেছি। একটা মেথড আমাদের author এর ভ্যালু রিট্রিভ করতে দেয়; সেটা আমাদের get মেথড। অন্য মেথড আমাদের author এর ভ্যালু পরিবর্তন করতে দেয়।

আমরা নিচের কোড ব্যবহার করে এটি একশনে দেখতে পারি:

var streetcar = new Book("A Streetcar Named Desire", ""); streetcar.author = "Tennessee Williams"; console.log(streetcar.author); 

আমাদের কোড রিটার্ন করে: Tennessee Williams।

আমরা streetcar নামে একটি অবজেক্ট আরম্ভ করেছি এবং এটিকে A Streetcar Named Desire টাইটেল দিয়েছি। তারপর আমরা আমাদের কোডে সংজ্ঞায়িত সেটার ব্যবহার করে author এর ভ্যালু Tennessee Williams সেট করেছি। অবশেষে, আমরা আমাদের কোডে সংজ্ঞায়িত গেটার মেথড ব্যবহার করে author এর ভ্যালু কনসোলে প্রিন্ট করেছি।

উপসংহার

যদিও ক্লাসগুলো জাভাস্ক্রিপ্টে কোনো নতুন ফাংশন্যালিটি যোগ করে না, তারা ফাংশন লিখা সহজ করে দেয় যদি আপনি অবজেক্ট-ওরিয়েন্টেড প্রোগ্রামিংয়ে অভ্যস্ত হন।

ক্লাসগুলো জাভাস্ক্রিপ্টের প্রোটোটাইপ-ভিত্তিক ডিজাইনকে অ্যাবস্ট্র্যাক্ট করে এবং এটিকে আরও অবজেক্ট-ওরিয়েন্টেড মনে করায়। "মনে করায়" শব্দটি অত্যন্ত গুরুত্বপূর্ণ কারণ, মনে রাখবেন, ক্লাসগুলো ফাংশন। ক্লাসগুলো সিনট্যাক্টিক সুগারের বাইরে আর কিছু নয়।

এখন আপনি ক্লাস জাভাস্ক্রিপ্ট এক্সপার্টের মতো ব্যবহার করতে পারবেন!

  1. JavaScript appendChild: একটি গাইড

  2. জাভাস্ক্রিপ্টে ক্লাস (class) কী?

  3. জাভাস্ক্রিপ্টে super কীওয়ার্ড কী?

  4. জাভাস্ক্রিপ্টে Class কীওয়ার্ড