56. دمج الـ Observables: forkJoin و combineLatest

تتطلب العديد من ميزات التطبيق استرداد البيانات من نقاط نهاية أو مصادر متعددة في وقت واحد. يوفر RxJS دوال تجميع مختلفة لدمج تدفقات البيانات.

1. forkJoin (انتظار إكمال الجميع)

forkJoin مشابه لـ Promise.all(). يأخذ مصفوفة من Observables وينتظر اكتمال كل واحد منها. بمجرد اكتمالها جميعاً، فإنه يطلق مصفوفة واحدة (أو كائناً) يحتوي على القيمة الأخيرة من كل Observable مصدر، ثم يكتمل هو نفسه.

حالة الاستخدام: جلب قطع متعددة ومستقلة من البيانات المطلوبة في وقت واحد (على سبيل المثال، الحصول على بيانات المستخدم وإعدادات التطبيق عند تحميل الصفحة).

typescript import { forkJoin, of } from 'rxjs';

const user$ = this.http.get('/api/user/1'); const permissions$ = this.http.get('/api/permissions');

forkJoin([user$, permissions$]).subscribe( ([userData, permissionData]) => { console.log('All data loaded:', userData, permissionData); // تهيئة حالة التطبيق } );

2. combineLatest (التفاعل مع أي تغيير)

يأخذ combineLatest Observables متعددة ويطلق قيمة جديدة كلما أطلق أي من Observables المصدر قيمة. القيمة المُطلَقة هي مصفوفة أو كائن يحتوي على أحدث قيمة من كل Observable مصدر.

حالة الاستخدام: التحديثات في الوقت الفعلي بناءً على مصدرين أو أكثر من المصادر التابعة (على سبيل المثال، تصفية قائمة بناءً على تدفق إدخال و تدفق تحديد قائمة منسدلة).

typescript import { combineLatest, timer } from 'rxjs';

const timerOne$ = timer(1000, 4000); // يطلق 0, 1, 2, ... const timerTwo$ = timer(2000, 4000); // يطلق 0, 1, 2, ...

combineLatest([timerOne$, timerTwo$]).subscribe( ([t1, t2]) => { console.log(T1: ${t1}, T2: ${t2}); } );

/* Output sequence example: (انتظار ثانيتين) T1: 0, T2: 0 (عند 4 ثوان) T1: 1, T2: 0 (عند 6 ثوان) T1: 1, T2: 1 */

الاختلاف الرئيسي: يكتمل forkJoin بعد إطلاق واحد؛ يظل combineLatest نشطاً ويستمر في الإطلاق.