Saber mazooji
Saber mazooji
خواندن ۲ دقیقه·۳ سال پیش

شرح Utility Types در تایپ اسکریپت بخش اول


گاهی وقت ها در تایپ اسکریپت , نوع خاصی از type یا interface موجود نیازمون میشه با Utility Types ها ما می‌تونیم type یا interface موجود رو به شکل خاصی تغییر بدیم میشه گفت یک instance با تغییرات و شرطهایی ازشون بسازیم....

تعداد Utility Types ها زیاده به همین خاطر در چندین بخش اونا رو توضیح میدم

1.Partial<Type>

تایپ partial تایپ‌های شما رو اختیاری میکنه(optional)
به صورتی که تایپ خود را به partial پاس بدید و مقدار برگشتی آن تایپی تماما optional است

Partial<Type>

Partial Type sample code
Partial Type sample code

به تابع updateTodo در لاین 6 دقت کنید که argument دوم آن همان تایپ ‌Todo اما از جنس Partial می‌باشد به همین خاطر در لاین 15 وقتی که تابع رو call میکنیم parameter دوم optional شده و می‌توانیم title رو پاس ندیم.

2.Required<Type>

تایپ Required همان طور از اسمش پیداست تمامی مقادیر رو اجباری میکنه دقیقا برعکس Partial

Required type sample code
Required type sample code

همانطور می‌بینید در لاین 8 وقتی که b رو به آبجکت اضافه نکرده‌ایم چون اینترفیس Props اجباری شده است خطا دریافت می‌کنیم.

3.Readonly<Type>

این utility Type یک اینترفیس یا تایپ را Readonly می‌کنه! یعنی وقتی به متغیری این نوع تایپ داده بشه به هیچ صورت تغییر داده نمیشه و فقط خواندنیه....

ReadOnly Type sample code
ReadOnly Type sample code

در لاین 9 مقدار title تغییر داده نمی‌شه چون readonly هستش

4.Record<Keys,Type>

تایپ record میتونه دو تایپ رو با هم ترکیب کنه به صورتی که پارامتر اول key و پارامتر دوم type هستش

برای درک بهتر دو نمونه ببینیم

Record type first sample
Record type first sample

تایپ ‌‌Colors با Record تعریف شده و چندتا key اول گرفته بعد تایپ اونا رو دریافت کرده خروجی این تایپ همانند لاین 5 هستش
دقت کنید لاین 5 ربطی به تایپ نداره فقط نمونه‌ای از خروجی Colors هستش...
نمونه دوم:

Record type second sample
Record type second sample

5.Pick<Type, Keys>

تایپ pick میتونه خیلی پرکاربرد باشه
این تایپ بر اساس انتخاب شما تایپ دلخواهتان را برمیگردونه نحوه استفاده از آن به این صورته که
پارامتر اول type رو از شما می‌گیره و پارامتر دوم آن keys . که مقادیری هستند که برای شما از دل type انتخاب می‌کنه...
به زبونه ساده بهش می‌گید بره از یک تایپ یک یا چندتا مقدار برداره و تایپ جدیدی رو برگردونه

Pick type sample
Pick type sample

در لاین 7 ما از اینترفیس Todo مقادیر title , completed رو انتخاب کرده‌ایم...
در نتیجه یک تایپ جدید داریم که شامل title , completed می‌باشد

خیلی ساده با Pick می‌تونیم از نوشتن تایپ های تکرار پرهیز کنیم ایزی پیزی :)

6.Omit<Type, Keys>

تایپ omit به صورته که یک تایپ از تایپ مورد نظر به غیر از مقادیر keys به شما برمیگردونه...
یعنی همه ی type به غیر از keys تقریبا شبیه pick هستش
در pick ما انتخاب می‌کردیم کدوم رو برداریم اما در omit ما مشخص می‌کنیم کدوم رو برنداریم :)

Omit type sample
Omit type sample

همانطور می‌بینید مقدار description رو از انتخابمون حذف کردیم و تایپ جدیدمون فقط شامل
title,completed,createdAt می‌باشد.


امیدوارم تونسته باشم با utility تایپ ها آشناتون کنم
همانطور در مقدمه گفتم utility types در چند بخش توضیح می‌دم پس منتظر بخش‌های دیگه هم باشید.

اگردیدیدجاییروبهاشتباهتوضیحدادمدرکامنتالطفکنیدبگید:)
https://virgool.io/@sabermazoji/%D8%B4%D8%B1%D8%AD-utility-types-%D8%AF%D8%B1-%D8%AA%D8%A7%DB%8C%D9%BE-%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-%D8%A8%D8%AE%D8%B4-%D8%AF%D9%88%D9%85-pt12spbqhq9j
تایپ اسکریپتUtility Types در تایپ اسکریپتUtility Typestypescriptutility types in typescript
یه برنامه نویس ? عاشق فرانت وب
شاید از این پست‌ها خوشتان بیاید