Observables, Operators, এবং Subjects গাইড ও নোট

Angular-এ Observables, Operators, এবং Subjects খুবই গুরুত্বপূর্ণ। এগুলি RxJS (Reactive Extensions for JavaScript) লাইব্রেরি থেকে আসে, যা Angular-এ রিএ্যাক্টিভ প্রোগ্রামিং এবং ডাটা স্ট্রীম হ্যান্ডলিং এর জন্য ব্যবহৃত হয়। এর মাধ্যমে অ্যাসিনক্রোনাস ডাটা স্ট্রীম (যেমন HTTP রিকোয়েস্ট, ইউজার ইন্টারঅ্যাকশন, ইভেন্টস) খুবই সহজে ম্যানেজ করা সম্ভব।

1. Observables

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

Observables প্রাথমিকভাবে Angular-এ HTTP রিকোয়েস্ট, ইউজার ইন্টারঅ্যাকশন, বা টাইমারগুলোর মাধ্যমে ডেটা রিসিভ করতে ব্যবহৃত হয়।

উদাহরণ:

import { Observable } from 'rxjs';

// একটি সিম্পল Observable তৈরি
const observable = new Observable(subscriber => {
  subscriber.next('Hello');
  subscriber.next('World');
  subscriber.complete();
});

observable.subscribe({
  next(value) { console.log(value); },
  complete() { console.log('Complete!'); }
});

এখানে, observable একটি স্ট্রীম তৈরি করে যেটি দুইটি next ইভেন্ট পাঠাবে এবং তারপর complete কল করবে।

2. Operators

Operators হলো RxJS এর ফাংশন যা Observable এর উপরে বিভিন্ন ধরনের অপারেশন সম্পাদন করে। অপারেটরগুলো map, filter, mergeMap, switchMap ইত্যাদি হিসেবে উপলব্ধ থাকে। এগুলোর মাধ্যমে আপনি Observable এর মান পরিবর্তন, ফিল্টার, এবং অন্যান্য নানা অপারেশন করতে পারেন।

Commonly Used Operators:

• map: Observable এর প্রতিটি মানে একটি ট্রান্সফরমেশন বা পরিবর্তন আনতে ব্যবহৃত হয়।

  উদাহরণ:

  import { map } from 'rxjs/operators';
  
  observable.pipe(
    map(value => value.toUpperCase())
  ).subscribe(value => console.log(value));
  

  এখানে, map অপারেটরটি Observable থেকে পাওয়া মানগুলোর প্রতিটি ভ্যালু uppercase-এ পরিবর্তন করবে।

• filter: Observable থেকে কিছু নির্দিষ্ট শর্তে মান ফিল্টার করতে ব্যবহৃত হয়।

  উদাহরণ:

  import { filter } from 'rxjs/operators';
  
  observable.pipe(
    filter(value => value === 'Hello')
  ).subscribe(value => console.log(value));
  

  এখানে, filter অপারেটরটি শুধুমাত্র 'Hello' ভ্যালু এলিমেন্টকে গ্রহণ করবে এবং অন্য সবকে বাদ দিবে।

• switchMap: একটি নতুন Observable স্ট্রীম তৈরির জন্য ব্যবহৃত হয় এবং পুরানো Observable কে অবহেলা করে নতুন Observable থেকে ডেটা নেয়।

  উদাহরণ:

  import { switchMap } from 'rxjs/operators';
  
  observable.pipe(
    switchMap(value => {
      return new Observable(subscriber => {
        subscriber.next(`${value} switched!`);
        subscriber.complete();
      });
    })
  ).subscribe(value => console.log(value));
  

• mergeMap: এটি একটি Observable থেকে আরেকটি Observable তৈরি করে এবং সমস্ত Observable থেকে আসা ভ্যালু মার্জ করে।

  উদাহরণ:

  import { mergeMap } from 'rxjs/operators';
  
  observable.pipe(
    mergeMap(value => {
      return new Observable(subscriber => {
        subscriber.next(`${value} merged!`);
        subscriber.complete();
      });
    })
  ).subscribe(value => console.log(value));
  

3. Subjects

Subjects হল একটি বিশেষ ধরনের Observable যা Observer এবং Observable উভয়ের মতো আচরণ করে। এটি একাধিক সাবস্ক্রাইবারকে একই ডাটা সরবরাহ করতে পারে এবং একাধিক সাবস্ক্রাইবারকে ডেটা পাঠানোর ক্ষমতা রাখে।

এটি সাধারণত যখন একাধিক কনজিউমারকে একই ডাটা শেয়ার করতে হয় তখন ব্যবহার করা হয়। সাধারণভাবে তিনটি ধরনের Subjects রয়েছে:

• Subject: সাধারন প্রকার, যেটি Observer এবং Observable উভয়ের মতো কাজ করে।
• BehaviorSubject: এটি সর্বদা সর্বশেষ মান রেখে চলতে পারে এবং নতুন সাবস্ক্রাইবারকে সর্বশেষ মান প্রদান করে।
• ReplaySubject: এটি একটি সাবস্ক্রাইবারকে পূর্ববর্তী নোটিফিকেশনগুলোও পাঠাতে পারে।
• AsyncSubject: এটি শুধুমাত্র শেষ মান পাঠায় যখন Observable সমাপ্ত হয়।

Example of a simple Subject:

import { Subject } from 'rxjs';

const subject = new Subject();

// Subscriber 1
subject.subscribe(value => {
  console.log(`Subscriber 1: ${value}`);
});

// Subscriber 2
subject.subscribe(value => {
  console.log(`Subscriber 2: ${value}`);
});

// Emit values
subject.next('Hello');
subject.next('World');

এখানে, Subject দুটি সাবস্ক্রাইবারকে একই ডেটা পাঠাচ্ছে। দুজনেই "Hello" এবং "World" দেখবে।

BehaviorSubject Example:

import { BehaviorSubject } from 'rxjs';

const behaviorSubject = new BehaviorSubject('Initial Value');

behaviorSubject.subscribe(value => {
  console.log(`Subscriber 1: ${value}`);
});

// Emit a new value
behaviorSubject.next('Updated Value');

// New Subscriber will get the last emitted value
behaviorSubject.subscribe(value => {
  console.log(`Subscriber 2: ${value}`);
});

এখানে, BehaviorSubject সাবস্ক্রাইবার ২ কে "Updated Value" পাঠাবে, কারণ এটি সর্বশেষ মান রাখে।

উপসংহার

• Observables: অ্যাসিনক্রোনাস ডেটা স্ট্রীম নিয়ে কাজ করতে ব্যবহৃত হয়।
• Operators: Observable এর উপরে বিভিন্ন ধরনের অপারেশন করতে সাহায্য করে, যেমন ফিল্টার, ম্যাপ, স্যুইচ, ইত্যাদি।
• Subjects: একাধিক সাবস্ক্রাইবারকে একই ডেটা পাঠানোর জন্য ব্যবহৃত হয়, এবং এটি একই সাথে Observer এবং Observable উভয়ের মতো কাজ করে।

Angular-এ RxJS ব্যবহার করে আপনি অ্যাসিনক্রোনাস ডেটা ম্যানেজমেন্ট এবং রিএ্যাক্টিভ প্রোগ্রামিং সহজে করতে পারেন।