نحوه دسترسی به خصوصیات اشیا On قابل مشاهده مانند یک متخصص واقعی

از

عکس پروفایل نویسنده

سلام ، همکار RxJS همکار! ?

امروز می خواهم یک بسته JS / TS را به اشتراک بگذارم که به شما امکان می دهد به وسایل موجود در Observables دسترسی داشته باشید:

source$.subscribe(o => console.log(o?.a?.b?.c))
// turn ↑ into ↓
source$.a.b.c.subscribe(console.log)

tl؛ dr: github.com/kosich/rxjs-proxify

یک مورد استفاده ساده: 

msg

ویژگی هر مقدار در جریان

import { proxify } from "rxjs-proxify";
import { of } from "rxjs";

const source = of({ msg: 'Hello' }, { msg: 'World' });
const stream = proxify(source);
stream.msg.subscribe(console.log); // 'Hello', 'World'

☝️ 

proxify

یک پروکسی برای داده قابل مشاهده ایجاد می کند

حتی می توانید از انتساب JS برای تخریب استفاده کنید:

const { msg } = proxify(source);
msg.subscribe(console.log); // 'Hello', 'World'

این بسته از پشتیبانی TypeScript خوبی برخوردار است ، بنابراین همه لوازم جانبی توسط گربه ها ، سگ ها و IDE ها هوشمند هستند:

import { of } from 'rxjs';
import { proxify } from 'rxjs-proxify';

const source = of({ a:1, b:1 }, { a:2, b:2 });
const stream = proxify(source);
stream. // <- will suggest .a .b .pipe .subscribe etc

? من می توانم اهداف شما را ببینم

همچنین می توان متدها را روی مقادیر فراخوانی کرد (حتی آنهایی که استفاده می کنند) 

this

کلمه کلیدی) ، به عنوان مثال:

import { proxify } from "rxjs-proxify";
import { of } from "rxjs";

const source = of({ msg: () => 'Hello' }, { msg: () => 'World' });
const stream = proxify(source);
// calls msg() fn on each value of the stream
stream.msg().subscribe(console.log); // 'Hello', 'World'

magic جادوی ناب ، من به شما می گویم

و شما هنوز آزادید که اپراتورهای RxJS را در هر عمق اعمال کنید:

import { proxify } from "rxjs-proxify";
import { of } from "rxjs";
import { scan } from "rxjs/operators";

const source = of({ msg: 'Hello' }, { msg: 'World' });
const stream = proxify(source);
stream.msg.pipe(scan((a, c)=> a + c)).subscribe(console.log); // 'HelloWorld'

درست مثل مشاهدات عادی!

این بسته از Proxies در زیر کاپوت استفاده می کند و آن را بطور بازگشتی در خصوصیات فرعی و نتایج روش اعمال می کند ، بنابراین این زنجیره می تواند به طور نامحدود عمیق باشد. و می توانید هر زمان که بخواهید. اشتراک یا .pipe اعمال کنید!

امتحان کنید

می توانید از طریق آن نصب کنید 

npm i rxjs-proxify

یا بصورت آنلاین تست کنید: stackblitz.com/edit/rxjs-proxify-repl

? مخزن

کد منبع و مثالهای بیشتر در این نسخه از سایت GitHub موجود است: github.com/kosich/rxjs-proxify

بیرون

اگر از خواندن لذت می برید – لطفاً این نکته را با دکمه های indicate نشان دهید – کمک زیادی می کند!

به زودی بررسی دقیق تری از lib و نحوه کار آن را ارسال می کنم

دنبالم کن توییتر برای ارسال های بیشتر RxJS ، React و JS

برای خواندن این مقاله از شما تشکر می کنم! واکنش پذیر باشید و روز خوبی داشته باشید

Psst .. برای مطالعه به چیز دیگری احتیاج دارید؟

من شما را تحت پوشش قرار دادم:

سیا

همچنین در https://dev.to/rxjs/turn-a-stream-objeks-into-an-object- of-streamams-2aed

مربوط

برچسب ها

با هکر نون همراه باشید

حساب رایگان خود را ایجاد کنید تا قفل تجربه خواندن سفارشی خود را باز کنید.

سئو PBN | خبر های جدید سئو و هک و سرور