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

در این پست می‌خواهم شما را با برنامه‌نویسی واکنش‌گرا، فواید آن آشنا کنم و چرا باید به آن اهمیت دهید.

حتی توسعه دهندگانی که قبلاً از Reactive Programming Frameworks (مثلاً Angular) استفاده می کنند با این مفهوم دست و پنجه نرم می کنند.
چیزی است اسرار امیز، و مجتمع، اغلب استفاده از آن را محدود می کند. با این حال، کدنویسی در RP بسیار مفید است قدرت های قدرتمند، که به وضوح دست کم گرفته می شوند. بنابراین امروز، من سعی خواهم کرد این راز را روشن کنم.

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

بیایید با یک تعریف ساده شروع کنیم:

برنامه نویسی واکنشی یک پارادایم برنامه نویسی اعلامی است که به آن مربوط می شود جریان های داده و انتشار تغییر.

در Reactive Programming، ما بر روی جریان داده تمرکز خواهیم کرد و اگر چیزی تغییر کند، جریان خود به روز می شود.

من این را با یک سوئیچ و یک لامپ نشان خواهم داد:

اعتبار: دن لو¹

در برنامه نویسی ضروری (احتمالاً این روش اصلی کدنویسی شماست)، سوئیچ وضعیت لامپ را تغییر می دهد. در این مورد، سوئیچ است فعال، فشار دادن حالت های جدید به لامپ. در حالی که لامپ است منفعل، به سادگی دستوراتی برای تغییر وضعیت آن دریافت می کند.

با این حال، در برنامه نویسی واکنشی برعکس است: لامپ به وضعیت سوئیچ گوش می دهد و سپس خود را بر اساس آن تغییر می دهد. در این مدل لامپ است واکنش پذیرتغییر وضعیت آن بر اساس وضعیت سوئیچ. در حالی که سوئیچ است قابل مشاهده، به این ترتیب که دیگران می توانند تغییرات حالت آن را مشاهده کنند.

اعتبار: دن لو¹

این رویکرد هنگام کار با جریان ها و جریان ها منطقی تر است، زیرا برای افزودن سینک های بیشتر (لامپ های بیشتر) نیازی به به روز رسانی منبع (سوئیچ) نخواهید داشت. هر لامپ خود مدیریت می شود و برای به روز رسانی خود به تغییر کد سوئیچ متکی نیست.

شاید شما آن را دیده باشید، اما قبلاً با این مفهوم آشنا هستید: هر بار که از این روش استفاده می کنید addEventListener، شما در رویدادها مشترک می شوید و سایر متغیرها، عناصر و غیره را به روز می کنید… بنابراین، شما در واقع برنامه نویسی واکنشی را انجام می دهید. در اینجا، ما این مفهوم را بیشتر پیش می بریم تا امکانات شگفت انگیزی از تعامل بین داده ها، اشیا، منابع و غیره ایجاد کنیم.

برنامه نویسی ضروری

حال به مقایسه خواهیم پرداخت امری ضروری در مقابل واکنش پذیر برنامه نويسي ².

بیایید آن را با یک تکلیف ساده توضیح دهیم: a = b + c. a در حال تخصیص نتیجه از b + c. این کار انجام می شود در لحظه که در برنامه نویسی ضروری: عبارت ارزیابی می شود و بعداً مقادیر b و c را می توان بدون تاثیر بر ارزش تغییر داد a. در بیشتر مواقع به این صورت است که کدنویسی می کنیم.

از سوی دیگر، در برنامه نویسی واکنشی، ارزش a هر زمان که مقادیر از به طور خودکار به روز می شود b یا c تغییر دهید، بدون اینکه برنامه مجبور باشد به صراحت عبارت را دوباره اجرا کند a = b + c برای تعیین مقدار اختصاص داده شده در حال حاضر a.

برنامه نویسی ضروری

let b = 1;
let c = 2;
let a = b + c;
b = 10;
console.log(a) // 3 (not 12 because "=" is not a reactive assignment operator)

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

حال تصور کنید که یک اپراتور ویژه دارید $= که مقدار یک متغیر را تغییر می دهد (کد را در سمت راست اپراتور اجرا می کند و نتیجه را به متغیر سمت چپ اختصاص می دهد) نه تنها زمانی که به طور صریح مقداردهی اولیه شود، بلکه همچنین زمانی که متغیرهای ارجاع شده (در سمت راست اپراتور) تغییر می کنند.

let b = 1;
let c = 2;
let a $= b + c; // 3
b = 10;
console.log(a); // 12

چنین اپراتور بسیار مفید خواهد بود: a همیشه به روز خواهد بود ممکن است شروع کنیم به تصور زبان‌ها و چارچوب‌های جدید با استفاده از این پارادایم، و دارای ویژگی‌های کاملاً قدرتمند.

این به ویژه برای معماری های MVC صادق است، جایی که برنامه نویسی واکنشی می تواند تغییرات را در یک مدل اساسی که به طور خودکار در یک نمای مرتبط منعکس می شود (معمولاً یک چارچوب UI مانند Angular of React برای یک برنامه وب) تسهیل کند.

@lirx/core به عنوان یک چارچوب

محبوب ترین فریم ورک واکنشی ReactiveX است و اجرای جاوا اسکریپت RxJS است. با این حال، این کتابخانه دارای مشکلات زیر است:

• فاقد مستندات واضح است (شما برای درک ساده ترین توابع به استاد برنامه نویسی واکنشی نیاز دارید)، و برخی از بخش های مستندات قدیمی هستند یا به سادگی وجود ندارند.
• بر اساس آن است states (“بعدی”، “خطا” و “کامل”) به جای جریان داده خالص، که بسیاری از اپراتورها را محدود می کند و کاربران را هنگام ایجاد تعاملات پیچیده گیج می کند.
• طراحی آن عملکرد آن و همچنین اندازه بسته نرم افزاری حاصل را محدود می کند.

در عوض، من از @lirx/core استفاده می‌کنم و به شما نشان می‌دهم که اجرای مثال قبلی چقدر ساده است:

const [$b, b$] = let$$(1);
const [$c, c$] = let$$(2);
const a$ = add$$(b$, c$); 

a$(a => console.log(a)); // 3

$b(10); // a$ => 12

من کد را تجزیه می کنم تا هر قسمت را با جزئیات توضیح دهم:

const [$b, b$] = let$$(1);

تابع let$$ به ما اجازه می دهد تا a را ایجاد کنیم متغیر واکنشی قابل تغییر. ما معمولاً نتیجه را به دو ثابت تقسیم می کنیم:

علاوه بر این، همانطور که احتمالاً حدس می‌زنید، ما پاراف کرده‌ایم b با ارزش 1.

ما روند را برای c، و اکنون دو متغیر واکنشی دارند.

سپس باید جمع را انجام دهیم:

const a$ = add$$(b$, c$); 

در اینجا ما اعلام می کنیم a$ به عنوان اضافه شدن از b$ و c$، با استفاده از تابع add$$. همه این متغیرها قابل مشاهده هستند. در نتیجه، اگر هر یک از b$ یا c$ تغییر می کند، پس a$ نیز تغییر می کند

از آنجا که a$ قابل مشاهده است، ما باید اشتراک در به آن برای خواندن ارزش آن (زیرا این یکی در طول زمان تغییر می کند):

a$(a => console.log(a));

b و c در حال حاضر یک مقدار دارند، در نتیجه بلافاصله خواهیم دید 3 وارد شده است.

در نهایت اگر آپدیت کنیم b نوشتن:

$b(10); 

a$ فورا به تغییر خواهد کرد 12، و این مقدار ثبت خواهد شد.

نتیجه

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

یک جریان می تواند به عنوان ورودی برای جریان دیگر استفاده شود. حتی چندین جریان را می توان به عنوان ورودی به جریان دیگری استفاده کرد. می توانید دو جریان را ادغام کنید. می‌توانید یک جریان را فیلتر کنید تا جریان دیگری را دریافت کنید که فقط رویدادهایی را دارد که به آنها علاقه دارید. می‌توانید مقادیر داده‌ها را از یک جریان به جریان جدید دیگر نگاشت کنید. و غیره.

به این ترتیب شما قادر خواهید بود که به خوبی تعریف شده و قدرتمند جریانی از رویدادها و داده ها، و شما ابزارهایی برای ایجاد جریانی خواهید داشت که کاملاً و به طور غریزی با الزامات برنامه های کاربردی پایدار و بزرگ مطابقت دارد و کاملاً با نیازهای شما مطابقت دارد.

من شدیداً به شما توصیه می کنم که صرفاً به برنامه نویسی ضروری فکر نکنید و برای کشف دنیای شگفت انگیزی از امکانات جدید شروع به تمرین برنامه نویسی واکنشی کنید.

تضمین میکنم پشیمون نمیشی🦸

درباره @lirx/core

@lirx/core یک چارچوب برنامه نویسی واکنشی است با بسیاری از توابع پیش ساخته،
مستندات واضح و مثال های زیادی برای آموزش اینکه چگونه استاد RP شوید.
این به شما امکان می دهد برنامه ها و خطوط لوله پیچیده ای را توسعه دهید که به راحتی مقیاس شوند.
علاوه بر این، سریعترین و کوچکترین است
کتابخانه جاوا اسکریپت برای Reactive Programming.
بنابراین کاندیدای خوبی برای شروع سفر خود با Observables است.

با خیال راحت این کتابخانه را آزمایش کنید، آن را به اشتراک بگذارید و نظرات خود را ارائه دهید.

1. دن لو – مقدمه ای بر برنامه نویسی واکنشی تابعی ↩

2. ویکی پدیا – برنامه نویسی واکنشی ↩