Proxy پترن در JavaScript
توضیحات اولیه
سلام امروز اومدم که شما رو با یک دیزاین پترن دیگه آشنا کنم به اسم Proxy
شاید اسمش واستون عجیب باشه و بگید پروکسی؟ پروکسی مگه واسه رد شدن از فیلترینگ و این داستانا نبود؟
برای این که بفهمید دقیقا منطق این دیزاین پترن چیه و منظورش رو خوب متوجه بشید اول باید بدونید که پروکسی هایی که استفاده میکنیم برای فیلترینگ چطوری کار میکنن
پروکسی ها چطوری کار میکنن؟
پروکسی ها توی دنیای شبکه بین ما و لینکی که بهش درخواست میزنیم هستن و هر اطلاعاتی که ما میخواییم از لینک بگیریم یا اطلاعاتی رو که میخواییم اطلاعاتی رو ارسال کنیم به لینک رو ابتدا به پروکسی میدیم بعد پروکسی میره درخواستمون رو میده به اون لینک و اگه باز درخواستمون پاسخی داشت پاسخ درخواستمون برمیگرده به سمت پروکسیمون و پروکسی درخواستمون رو برمیگردونه به ما
خیلی خلاصه بخوام بگم انگار ما با احمد قهریم و هر حرفی که میخواییم به احمد بگیم رو به رضا میگیم و رضا میره به احمد میگه و باز اگه احمد حرفی داشت با ما به رضا میگه تا رضا به ما برسونه پیامو
اگه بازم نفهمیدید که پروکسی ها چیکار میکنن عیبی نداره این عکس رو ببینید کامل متوجه میشید:
خوب حالا که فهمیدید پروکسی دقیقا چیکار میکنه بریم که بفهمیم دقیقا این پترن چیه.
منطق کلی این پترن چیه
منطق کلی این پترن میگه که ما برای تعامل هایی که داریم با آبجکت ها باید از یک واسطه استفاده کنیم و توی اون واسطه یک سری کنترل رو انجام بدیم و بعد تغییرات رو به آبجکت اصلی انتقال بدیم یا اگه میخواستیم مقداری رو از آبجکت دریافت کنیم از آبجکت اصلیمون نگیریم و از آبجکت واسطه بگیریم
چطوری باید یک واسطه ایجاد کنیم؟
توی اکما اسکریپت 6 یک کلاس خیلی خوب اضافه شد به جاوااسکریپت به اسم Proxy
که نحوه کار کردن باهاش این شکلیه :
از این به بعد برای گرفتن کار کردن با آبجکت person
نباید با خود آبجکت person
کاری انجام بدیم و فقط باید با آبجکت واسطه که personProxy
هست کار کنیم.
خوب این چه سودی داره واسمون؟
عجله نکنید :) هنوز نگفتم چه جادو هایی میتونید با این آبجکت واسطه بکنید.
کلاس Proxy
ما تو ورودی ( آرگومان ) دومش یک آبجکت میگیره که همه اتفاقات خوب اینجا اتفاق میوفته :)
ما توی آرگومان دوم کلاس Proxy
میتونیم یک آبجکت بسازیم و توش یک سری متد بنویسیم که هر کدومشون یک وظیفه داشته باشن و قبل از انجام شدن اون تعاملات روی آبجکت واسطمون وارد اون متد ها بشن تا بشه عملیات هایی رو مثلا زمان آپدیت کردن یک پراپرتی انجام داد
مثلا بگیم هر زمان که میخواست پراپرتی ای از آبجکت واسطمون آپدیت بشه برسی کنیم و بگیم اگه مقدار جدیدش عدد بود فقط آبجکتمون اصلیمون آپدیت بشه و در غیر این صورت آبجکت اصلی هیچ تغییری نکنه
خیلی خفنه نه؟ بریم پیاده سازیش کنیم
این آبجکت کنترل کننده رو چطوری باید بنویسیم حالا؟
ما توی آبجکت کنترل کنندمون متد های زیادی داریم که من قصد دارم دوتاشون رو توضیح بدم ولی همشون رو نمیشه تو این مقاله اورد ولی اگه کنجکاو بودید راجبشون اینجا رو بخونید
- متد
get
: زمانی اجرا میشه که ما میخواییم مقداری رو از آبجکت واسطه دریافت کنیم - متد
set
: زمانی اجرا میشه که ما بخواییم مقدار یکی از پراپرتی های آبجکت واسطه رو تغییر بدیم
بریم که یک مثال ببینیم حالا
توضیحات کد بالا:
- متد
get
: اگه پراپرتی ای داشت از آبجکت واسطه دریافت میشد این متد اجرا میشه و تو ورودی اولobj
رو به عنوان ورودی میگیره که کل آبجکتperson
هست و تو ورودی دومprop
رو میگیره که اسم پراپرتی ای هست که گرفته شده و توی متد هم یکconsole.log
گذاشتیم که چاپ میکنه متنی که لاین بعدیش بصورت کامنت وجود داره - متد
set
: اگه پراپرتی ای داشت مقدارش آپدیت میشد این متد اجرا میشه و تو ورودی اولobj
رو میگیره که کل آبجکتperson
هست و تو ورودی دومprop
رو میگیره که اسم پراپرتی ای هست که میخواد آپدیت بشه و تو ورودی سومvalue
رو میگیره که مقداری جدیدی هست که برای اون پراپرتی فرستادم و توی متد هم یکconsole.log
گذاشتیم که چاپ میکنه چیزی که لاین بعدیش بصورت کامنت وجود داره بعد میاد مقدار آبجکتمون رو آپدیت میکنه
نکته : اگر در strict mode
باشیم و در متد set
خودمان false
را ریترن کنیم به ارور میخوریم در نتیجه بهتر است اگر مشکلی وجود دارد false
را ریترن کنیم و در غیر این صورت true
را ریترن کنیم
اگه نتونستید نحوه ای که آبجکت واسطمون داره کار میکنه رو نفهمیدید گیف زیر رو ببینید تا کامل متوجه شید چه اتفاقی داره میوفته
در واقع ما با آبجکت person
هیچ کاری نداشتیم اما personProxy
ما داره خودش با آبجکت person
ارتباط برقرار میکنه
بیایید بهتر proxy هارو بنویسیم!
تو متد های set
و get
ای که توی آبجکت کنترل کنندمون داشتیم دیدید که ما برای دسترسی به آبجکت person
داشتیم از آرگومان اول متد استفاده میکردیم و مقدار رو با همون از آبجکت person
تغییر میدادیم یا میگرفتیمش اما راه حل ساده تر چیه؟
اینه که به جای نوشتن کد [prop]obj
از یک چیز دیگه استفاده کنیم به اسم Reflect
این آبجکت که بصورت گلوبال توی جاوااسکریپت تعریف شده یک سری ورودی از ما میگیره و این کار هارو خودش انجام میده
چطوری؟ بریم ببینیم!
پروکسی ها کجا به درد ما میخورن؟
همونطور که مشخصه پروکسی ها به درد تایید سنجی (validation) خیلی میخورن یا وقتی میخواییم اطلاعات یک آبجکت رو آپدیت کنیم یه تغییری تو دیتای ورودی ایجاد کنیم میتونیم از پروکسی ها استفاده کنیم
مشکلات این دیزاین پترن
این دیزاین پترن از اونجایی که برای هربار تعامل با آبجکت یکی از متد های کنترل کننده مارو اجرا میکنن به راحتی میتونن تو پرفورمنس ما تاثیر بدی بزارن و باعث بشن برنامه ما کند اجرا بشه برای همون باید مواظب باشیم که کجا ازش استفاده کنیم.
صحبت های پایانی
ممنونم از اینکه وقت با ارزشتون رو گذاشتید و مقاله من رو خوندید امیدوارم واستون مفید بوده باشه و چیزی به دانشتون اضافه کرده باشه
اگه متنی که نوشتم ایرادی داشت یا فکر میکنید با عوض کردن قسمتیش قابل فهم تر میشه ممنون میشم تو کامنت ها به من اعلام کنید
من برای نوشتن این متن ها اول این سایت میرم و منطق یک دیزاین پترن رو میخونم و بعد چیز هایی که فهمیدم رو برای شما مینویسم مثلا تو پست قبلی راجب Singleton پترن توضیح دادم که میتونید رو لینک زیر کلیک کنید و بخونیدش
مطلبی دیگر از این انتشارات
صرافی دیجیتالی چیست؟!
مطلبی دیگر از این انتشارات
معرفی کیف پول بلو ولت + آموزش استفاده از BlueWallet
مطلبی دیگر از این انتشارات
۶ راه برای ثروتمند شدن در ارز دیجیتال!