تجربه کار با Index Signature در TypeScript

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

مقدمه

وقتی از سمت بک اند API معرفی میشه، در قدم اول همیشه باهاشون روی interface به توافق میرسم و بعد پیاده سازی سمت API رو شروع میکنم. توافق به این صورته که جزئیات درخواست، ساختار دیتا و اسم و نوع فیلدها در ورودی و خروجی API به طور دقیق مشخص میشه. در صورت پیدا شدن نیاز به تغییر، بلافاصله همدیگه رو خبر میکنیم و جلسه میگذاریم تا به توافق نهایی جدیدی برسیم.

به سه دلیل، بهتره که برای خروجی API حتما interface تعریف بشه:

1. کد خواناتر باشه و تکلیف IDE با دیتایی که از API میاد روشن باشه.
2. هر برنامه نویس دیگه ای که سراغ کد اومد، بدونه منتظر گرفتن چه جوابی از سمت API هست.
3. آخرین توافق مشخص باشه و جلوی ادعاهای کذب گرفته بشه ( متاسفانه در بهترین سازمان ها هم شاهد چنین اتفاقاتی بودم! )

در ادامه مسیر میخوام به یه نمونه از این توافق ها بپردازم. تیم بک اند به نظرم تصمیم عجیبی گرفتند و زورم نرسید که اصلاح مورد نظرم رو روی توافق انجام بدم. بجاش با مفهوم Index Signature در TypeScript آشنا شدم.

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

در ادامه، به ازای خروجی هر API یک interface تعریف میکردم. مثلا برای گرفتن لیست محصولات، interface پایین رو به ازای خروجی هر Product تعریف میکردم:

و موقع صدا زدن API، تایپ خروجی رو برای تابع get یا post یا سایر توابع تعریف میکردم:

در کد بالا مشخصه که خروجی API یک لیست از محصولاته که به صورت پاسخ استاندارد برمیگرده.

بعد از یک مدت ، بحث pagination پیش اومد و قرار شد تیم بک اند همه خروجی های صفحه بندی شون رو داخل پاسخ استاندارد و به این صورت بفرستند:

یعنی برای صدا زدن لیست محصولات به صورت صفحه بندی، کد زیر رو صدا میکردم:

اما تیم بک اند به دلخواه خودشون تصمیم دیگه ای گرفتند و هر چی اصرار کردم که این پیچیدگی اضافه ست قبول نکردند.

اونها تصمیم گرفتند هر دیتای pagination رو با فیلد مخصوص خودش بفرستند. مثلا برای لیست صفحه بندی شده محصولات یک فیلد منحصر به فرد بنام productsSortedById تعریف کنند و لیست رو به صورت زیر بفرستند:

اینجا بود که منم تایپ جدیدی اضافه کردم به اسم IDynamicField:

در واقع K یک property دینامیک از جنس string هست که اسم property رو مشخص میکنه و هر مقداری بهش بدم، دنبال اون property با مقداری از نوع T میگرده.

و API رو به صورت زیر صدا کردم:

اینجوری شد که با مفهوم Index Signature در TypeScript آشنا شدم.

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

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