یکی از عمده ویژگی های تایپ اسکریپت، امکان استقاده از دکوراتور است. البته این ویژگی در پروپوزال ES هست ولی با تایپ اسکریپت در حال حاضر میتوانید از آن استفاده کنید. اساسا یکی از ایده اصلی تایپ اسکریپت رو میشه دکوراتور دانست. میدانید که تایپ اسکریپت با همکاری مشترک گوگل و مایکروسافت ارایه شد. گوگل برای این همکاری در واقع قصد داشت زبان AtScript خود را بر روی تایپ اسکریپت اجرا کند که در نهایت در نسخه ۲ تایپ اسکریپت اغلب ویژگی های زبان گوگل به صورت نایتیو ارایه شد. گوگل قرار بود نسخه ۲ انگولار را با AtScript بنویسد که با این اتفاق انگولار با تایپ اسکریپت نوشته شد. به نظرم مهمترین ویژگی تایپ اسکریپت پس از استاتیک بودن، ارایه راهکارهایی برای Meta Programming و Annotation در زبان از طریق دکوراتورهاست. در این نوشتار به بررسی این ویژگی میپردازیم.


لینک ویدیو در آپارات

لینک ویدیو در یوتیوب

به صورت کلی چیزی که به عنوان دکوراتور میشناسیم چیزی غیر از یک تابع نیست که بسته به شیوه استفاده و مکان استفاده پارامترهای خاصی برای آن ارسال می شود که میتوان لاجیک مد نظر خود را در آن پیاده نمود. این تابع میتواند به اعلان کلاس، متد، گتر و ستر ها، پراپرتی ها و پارامترها اضافه شود. برای استفاده هم از @ استفاده می‌شود. دو شیوه تعریف دکوراتور وجود دارد. در شیوه اول یک تابع ساده تعریف میشود.

function sealed(target) {
  // do something with 'target' ...
}

و در شیوه دوم که به آن فاکتوری می‌گویند، یک تابع سطح بالاتر نوشته می‌شود که تابع دکوراتور را برمیگرداند.

function color(value: string) {
  // this is the decorator factory
  return function (target) {
    // this is the decorator
    // do something with 'target' and 'value'...
  };
}

شیوه استفاده هم به شرح زیر است.

@sealed
@color('blue')
class Customer {}

در چنین شرایطی دکوراتورها از بالا به پایین ارزیابی می شود و سپس از پایین به بالا چاپ می‌شود.

دکوراتور کلاس

دکوراتور کلاس قبل از اعلان کلاس نوشته می‌شود و در زمان اجرا سازنده آن کلاس برای تابع دکوراتور ارسال می شود. اگر این تابع مقداری برگرداند، آن مقدار جایگزین سازنده کلاس مورد نظر می‌شود. به عنوان مثال تابع دکوراتور زیر باعث می شود کلاس مقصد Seal شود بدین معنی که امکان اضافه کردن پراپرتی به کلاس را نمی دهد.

function sealed(constructor: Function) {
  Object.seal(constructor);
  Object.seal(constructor.prototype);
}

دکوراتور متد

دکوراتور گتر و ستر

دکوراتور پراپرتی

دکوراتور پارامترها

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *