امین ایمانی
امین ایمانی
خواندن ۲ دقیقه·۴ سال پیش

استفاده از استاندارد SRP در React (کامپوننت های تک وظیفه)

مفهوم srp به این موضوع دلالت داره که هر کامپوننت باید یک وظیفه رو انجام بده.

مثلا داشتن یک کامپوننت که هم یک درخواست میده به Rest Api و هم دیتای برگشتی رو نمایش میده یک آنومالی محسوب میشه.

شیوه صحیح این هست که یک کامپوننت درخواست رو بفرسته و دیتا رو بگیره ، و به یک کامپوننت فرزند از طریق Prop یا State Management که میتونه ریداکس یا کانتکست باشه ، پاس داده بشه .

توی حالت بالا ۲وظیفه وجود داره و ۲ کامپوننت .

نکته بسیار مهم : هر کامپوننت باید تنها ۱ دلیل برای تغییر وضعیت داشته باشه

حالا این یعنی چی؟؟؟

باز هم مفهوم تک وظیفه ای بودن هر کامپوننت مطرح شده .

حالا دلیل این تک وظیفه ای بودن چی هست ؟؟

زمانی که شما چندین و چند کامپوننت تک وظیفه ای داشته باشید ، دیباگ کردن پروژه خیلی ساده تر خواهد بود چون طبق مشکل پیش اومده مشخص هست که کدام کامپوننت وظیفه خودش رو به درستی انجام نمیده.

مزیت تک وظیفه ای بودن کامپوننت ها این هست که کاملا تحت کنترل ما هستن و تمامی تغییرات توی محیطی کاملا ایزوله اتفاق خواهد افتاد (این تغییرات نباید کامپوننت دیگه ای رو تحت اثیر قرار بده )

تک وظیفه ای بودن کامپوننت ها سایز هر کامپوننت رو محدود نگه میداره و باعث تمرکز بیشتر رو کلیت پروژه خواهد شد . علاوه بر این موضوع کامپوننت های تک وظیفه ای فرآیند کد نویسی راحت تری دارن و در آینده برای تغییرات در کد و تست نویسی پیچیدگی چندانی نخواهند داشت.

اگر کامپوننتی داریم که بیش از ۱ وظیفه رو انجام میده باید بر اساس و اولویت اجرای کد به بخش های کوچک تری تقسیم بشن.

کپسوله سازی کامپوننت ها :

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

Coupling یک سیستم ویژگی کامپوننت هست که درجه یا میزان وابستگی بین کامپوننت هارو مشخص میکنه و ۲ نوع مختلف داره :

1. Loose Coupling:

حالتی از ارتباط کامپوننت ها باهم هست که کمترین میزان ارتباط وجود داره و کامپوننت ها در حالت ایده آل کاملا مستقل از هم کار میکنن.

2. Tight Coupling :

در این حالت هر کامپوننت ارتباط های بسیار و تنگاتنگی با کامپونتت های دیگه داره و در این حالت استقلال کامپوننت ها از هم در پایین ترین حد و گاها صفر قرار داره .

استاندارد طراحی ساختار کامپوننت ها loose coupling رو ترجیح میده چرا که این مورد توصیف ذاتی واضحی از SRP داره .

reactsrpکامپوننتspaری اکت
برنامه نویس - یک ماهی کوچک در اقیانوس تکنولوژی
شاید از این پست‌ها خوشتان بیاید