Observables என்றால் என்ன மற்றும் Angular RxJS ஐ எப்படி பயன்படுத்துகிறது?

Question

Accepted Answer

**Observable** (**RxJS** நூலகத்திலிருந்து) **நேரத்தின் மீது மதிப்புகளின் ஒரு ஸ்ட்ரீம்** ஐ பிரதிநிதித்துவம் செய்கிறது, அதை நீங்கள் குழுசேர செலவுள்ளது. Angular RxJS ஐ விரிவாக பயன்படுத்துகிறது — HTTP கோரிக்கைகள், ரூட்டர் நிகழ்வுகள், படிவங்கள் மற்றும் `EventEmitter` அனைத்தும் Observable அடிப்படையாக உள்ளன — எனவே அவற்றைப் புரிந்துகொள்வது அவசியம். ## Observable vs Promise ```text Promise: a SINGLE future value, eager, can't cancel Observable: ZERO-to-MANY values over time, lazy (runs on subscribe), CANCELLABLE ``` Observables பல மதிப்புகளை வெளிப்படுத்தலாம், குழுசேரும் போது மட்டுமே செயல்படுகின்றன, மற்றும் குழுவிலிருந்து விலக முடியும் (ரத்து செய்யப்படுகிறது) — அவற்றை நிகழ்வுகள், ஸ்ட்ரீமுகள் மற்றும் HTTP க்கு আদর்சமாக மாற்றுகின்றன, அதை நீங்கள் ரத்து செய்ய விரும்பலாம். ## குழுசேர்தல் ```ts import { HttpClient } from "@angular/common/http"; this.http.get("/api/users").subscribe({ next: (users) => this.users = users, // each emitted value error: (err) => console.error(err), // on error complete: () => console.log("done"), // stream finished }); ``` None நீங்கள் `.subscribe()` வரை எதுவும் நடக்காது — Observable சோம்பேறி. ## ஆபரேட்டர்கள் ஸ்ட்ரீங்களை மாற்றுகிறது ```ts import { map, filter, debounceTime } from "rxjs/operators"; this.searchInput.valueChanges.pipe( debounceTime(300), // wait for typing to pause filter(text => text.length > 2), // ignore short queries map(text => text.trim()), // transform ).subscribe(query => this.search(query)); ``` ஆபரேட்டர்கள் (`.pipe()` உள்ளே சங்கிலিக்கப்பட்டவை) ஸ்ட்ரீமை அறிவிப்பூர்வகமாக மாற்றுகின்றன — debounce, filter, map முதலியன — பொதுவான அவ-ஐ சிக்கல்கள் (தேடல்-நீங்கள்-வகை போன்றவை) நிமிர்ந்து தீர்க்கிறது. ## நினைவு-கசிவு ஆபத்து: குழுவிலிருந்து விலக ```ts import { Subscription } from "rxjs"; private sub = new Subscription(); ngOnInit() { this.sub = this.data$.subscribe(...); } ngOnDestroy() { this.sub.unsubscribe(); } // ❗ prevent leaks ``` ம்যানுவல் குழுசேர்ப்புகள் `ngOnDestroy` இல் சுத்தம் செய்யப்பட வேண்டும், அல்லது அவை கூறு போனதற்குப் பிறகு இயங்கிக்கொண்டே இருக்கும் — ஒரு நினைவு கசிவு. பொதுவான தீர்வுகள்: **`async` பைப்** (தன்னியக்கமாக குழுவிலிருந்து விலகுகிறது) அல்லது `takeUntilDestroyed()`. ```html

``` ## ஏன் முக்கியம் RxJS Observables Angular வழியாக பुண்டப்பட்டுள்ளன — HttpClient, reactive படிவங்கள் அல்லது ரூட்டர் இல்லாமல் நீங்கள் அவற்றை பயன்படுத்த முடியாது. குழுசேர்ப்பு, ஆபரேட்டர்கள் மற்றும் குறிப்பாக **குழுவிலிருந்து விலகல்** (அல்லது `async` பைப் ஐ பயன்படுத்தி m m பணிகளை தவிர்க்க) புரிந்துகொள்வது நிர்ணায়கமானது: இது Angular இன் அசிங்கிரோனஸ் தரவுக்கான சக்தির উৎสாகம் மற்றும் அதன் மிகப் பொதுவான பிழைகளில் ஒன்று (மறந்த குழுசேர்ப்புகளிலிருந்து கசிவு).