TypeScript Decorators এর বেসিক ধারণা

TypeScript এর Decorators এবং Metadata - টাইপস্ক্রিপ্ট (Typescript) - Web Development

206

Decorators TypeScript এবং ES7 এর একটি শক্তিশালী ফিচার যা ক্লাস, মেথড, প্রপার্টি, অথবা প্যারামিটারদের ওপর অতিরিক্ত ফাংশনালিটি যোগ করতে ব্যবহৃত হয়। এটি একটি বিশেষ ধরনের ফাংশন যা ক্লাস বা তার সদস্যদের (properties, methods) ওপর অ্যাপ্লাই হয় এবং তাদের আচরণ পরিবর্তন বা প্রসারিত করে। Decorators মূলত ক্লাসের বা মেথডের আচরণকে ডাইনামিকালি পরিবর্তন করতে ব্যবহৃত হয়।

TypeScript এ Decorators ES6 এবং পরবর্তী সংস্করণে স্বীকৃত হলেও, এটি একটি experimental ফিচার হিসেবে বিবেচিত হয় এবং tsconfig.jsonexperimentalDecorators অপশন চালু করতে হয়।


১. Decorator চালু করা

TypeScript এ Decorators ব্যবহার করতে হলে প্রথমে tsconfig.json ফাইলে experimentalDecorators অপশনটি true করতে হয়।

উদাহরণ: tsconfig.json

{
  "compilerOptions": {
    "experimentalDecorators": true,
    "target": "es6"
  }
}

২. Decorator কি এবং কিভাবে কাজ করে?

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

৩. Decorator এর টাইপস

TypeScript এ কয়েকটি ধরনের Decorators ব্যবহার করা হয়:

  1. Class Decorators: ক্লাসের উপরে একটি ডেকোরেটর অ্যাপ্লাই হয়।
  2. Method Decorators: মেথডের উপরে একটি ডেকোরেটর অ্যাপ্লাই হয়।
  3. Property Decorators: প্রপার্টির উপরে একটি ডেকোরেটর অ্যাপ্লাই হয়।
  4. Parameter Decorators: প্যারামিটারের উপরে একটি ডেকোরেটর অ্যাপ্লাই হয়।

৪. Class Decorators

Class Decorators ক্লাসের পুরো ব্যবহারের উপর কার্যকর হয় এবং এটি ক্লাসের কনস্ট্রাকটর ফাংশনকে পরিবর্তন বা প্রসারিত করতে পারে।

উদাহরণ: Class Decorator

function Injectable(target: Function) {
  console.log(`Class ${target.name} is Injectable`);
}

@Injectable
class MyService {
  constructor() {
    console.log("MyService instantiated");
  }
}

const service = new MyService();

এখানে:

  • Injectable একটি ডেকোরেটর যা MyService ক্লাসের উপরে প্রয়োগ করা হয়েছে।
  • এই ডেকোরেটরটি কনস্ট্রাকটরের ওপর কার্যকর হয়েছে এবং ক্লাসের ইনস্ট্যান্স তৈরি হলে কনসোলে একটি বার্তা প্রদর্শন করবে।

৫. Method Decorators

Method Decorators একটি মেথডের উপর কার্যকর হয় এবং মেথডের আচরণ পরিবর্তন বা প্রসারিত করতে পারে।

উদাহরণ: Method Decorator

function Log(target: any, propertyName: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  
  descriptor.value = function (...args: any[]) {
    console.log(`Method ${propertyName} called with args: ${args}`);
    const result = originalMethod.apply(this, args);
    console.log(`Method ${propertyName} returned: ${result}`);
    return result;
  };
}

class Calculator {
  @Log
  add(a: number, b: number): number {
    return a + b;
  }
}

const calc = new Calculator();
calc.add(2, 3);  // আউটপুট হবে: Method add called with args: [2, 3] \n Method add returned: 5

এখানে:

  • @Log ডেকোরেটর add মেথডের উপরে প্রয়োগ করা হয়েছে, যা মেথড কলের আগ ও পর লগিং করবে।
  • Log ডেকোরেটরটি descriptor.value এর মাধ্যমে মেথডটির ডিফল্ট আচরণ পরিবর্তন করছে।

৬. Property Decorators

Property Decorators প্রপার্টির উপরে কার্যকর হয় এবং তার আচরণ পরিবর্তন করতে পারে।

উদাহরণ: Property Decorator

function MaxLength(max: number) {
  return function (target: any, propertyName: string) {
    let value: string;

    const getter = () => value;
    const setter = (newValue: string) => {
      if (newValue.length > max) {
        console.log(`${propertyName} is too long! Max length is ${max}`);
      } else {
        value = newValue;
      }
    };

    Object.defineProperty(target, propertyName, {
      get: getter,
      set: setter
    });
  };
}

class User {
  @MaxLength(10)
  name: string;

  constructor(name: string) {
    this.name = name;
  }
}

const user = new User("John Doe");
user.name = "A very long name";  // আউটপুট: name is too long! Max length is 10

এখানে:

  • MaxLength ডেকোরেটরটি name প্রপার্টির উপর প্রয়োগ করা হয়েছে, যাতে প্রপার্টির মান ১০টি অক্ষরের বেশি হলে একটি বার্তা প্রদর্শিত হবে।

৭. Parameter Decorators

Parameter Decorators প্যারামিটারগুলোর উপর প্রয়োগ হয় এবং প্যারামিটারের টাইপ বা মান নিয়ন্ত্রণ করতে পারে।

উদাহরণ: Parameter Decorator

function LogParameter(target: any, methodName: string, parameterIndex: number) {
  console.log(`Method ${methodName} has a parameter at index ${parameterIndex}`);
}

class User {
  greet(@LogParameter message: string) {
    console.log(`Hello, ${message}`);
  }
}

const user = new User();
user.greet("Alice");  // আউটপুট: Method greet has a parameter at index 0

এখানে:

  • LogParameter ডেকোরেটরটি greet মেথডের প্যারামিটার message এর উপর অ্যাপ্লাই করা হয়েছে।

৮. Decorator ব্যবহার এবং সীমাবদ্ধতা

TypeScript এ ডেকোরেটরগুলির কিছু সীমাবদ্ধতা রয়েছে:

  • Decorator ব্যবহার experimental (অর্থাৎ experimentalDecorators অপশন চালু করতে হয়)।
  • Functionality limitations: কিছু পরিস্থিতিতে ডেকোরেটর প্রপার্টির বা মেথডের আচরণ পরিবর্তন করতে পারে, কিন্তু সরাসরি তাদের মান পরিবর্তন করা কঠিন হতে পারে।

সারাংশ

TypeScript এর decorators একটি শক্তিশালী ফিচার যা ক্লাস, মেথড, প্রপার্টি বা প্যারামিটারগুলির ওপর অতিরিক্ত কার্যকারিতা যোগ করতে ব্যবহৃত হয়। এটি ক্লাসের প্রোপার্টি বা মেথডের আচরণে ডাইনামিক পরিবর্তন ঘটানোর জন্য অনেক সুবিধা প্রদান করে। তবে, এটি একটি experimental ফিচার হওয়ায়, এর ব্যবহার করার আগে কিছু কনফিগারেশন এবং সাবধানতা অবলম্বন করা প্রয়োজন।

Content added By
Promotion

Are you sure to start over?

Loading...