آموزش TypeScript جلسه 9 :Type Alias | ساخت تایپ‌های سفارشی و افزایش خوانایی کد

TypeScript امکانات زیادی برای مدیریت نوع داده‌ها در اختیار ما قرار می‌دهد. یکی از کاربردی‌ترین قابلیت‌های آن Type Alias است که به ما اجازه می‌دهد برای نوع‌های پیچیده و تکراری، نام‌های سفارشی تعریف کنیم.

در پروژه‌های واقعی، استفاده از Type Alias باعث افزایش خوانایی کد، کاهش تکرار و ساده‌تر شدن نگهداری پروژه می‌شود.

در این جلسه یاد می‌گیریم:

• Type Alias چیست؟
• چگونه Type Alias ایجاد کنیم؟
• استفاده از Type Alias برای Object
• استفاده از Type Alias برای Union Types
• تفاوت Type Alias و Interface
• بهترین روش‌های استفاده در پروژه‌های واقعی

Type Alias چیست؟

Type Alias به ما اجازه می‌دهد برای یک نوع داده، یک نام جدید تعریف کنیم.

به جای اینکه یک ساختار طولانی را چندین بار تکرار کنیم، می‌توانیم آن را یک بار تعریف کرده و در سراسر پروژه استفاده کنیم.

مثال:

type UserName = string;

let firstName: UserName = "Ali";
let lastName: UserName = "Rezaei";

در این مثال، UserName فقط یک نام جدید برای نوع string است.

چرا باید از Type Alias استفاده کنیم؟

فرض کنید در چندین بخش پروژه ساختار زیر را نیاز داریم:

{
  id: number;
  name: string;
  email: string;
}

اگر این ساختار را بارها تکرار کنیم، نگهداری کد سخت می‌شود.

راه بهتر:

type User = {
  id: number;
  name: string;
  email: string;
};

اکنون می‌توانیم در هر جایی از پروژه از آن استفاده کنیم.

const user: User = {
  id: 1,
  name: "Ali",
  email: "ali@test.com"
};

Type Alias برای Object

رایج‌ترین کاربرد Type Alias تعریف ساختار اشیاء است.

type Product = {
  id: number;
  title: string;
  price: number;
};

استفاده:

const laptop: Product = {
  id: 101,
  title: "MacBook Pro",
  price: 2500
};

Type Alias برای Function

می‌توانیم نوع توابع را نیز تعریف کنیم.

type SumFunction = (
  a: number,
  b: number
) => number;

استفاده:

const sum: SumFunction = (a, b) => {
  return a + b;
};

Type Alias برای Array

type UserList = string[];

استفاده:

const users: UserList = [
  "Ali",
  "Sara",
  "Reza"
];

Type Alias و Union Types

یکی از مهم‌ترین کاربردهای Type Alias تعریف Union Type است.

بدون Alias:

let status:
  "pending"
  | "success"
  | "failed";

با Alias:

type RequestStatus =
  | "pending"
  | "success"
  | "failed";

let status: RequestStatus;

کد خواناتر و قابل نگهداری‌تر می‌شود.

ترکیب چند Type Alias

می‌توان چند Alias را با هم ترکیب کرد.

type Address = {
  city: string;
  country: string;
};

type User = {
  id: number;
  name: string;
} & Address;

استفاده:

const user: User = {
  id: 1,
  name: "Ali",
  city: "Tehran",
  country: "Iran"
};

Type Alias برای Literal Types

type Theme =
  | "light"
  | "dark";

let currentTheme: Theme = "dark";

این روش از ورود مقادیر اشتباه جلوگیری می‌کند.

Type Alias در پروژه‌های Angular

در Angular معمولاً برای مدل داده‌ها از Type Alias استفاده می‌شود.

مثال:

type Hotel = {
  id: number;
  name: string;
  city: string;
  price: number;
};

در سرویس:

getHotels(): Observable<Hotel[]> {
  return this.http.get<Hotel[]>(
    '/api/hotels'
  );
}

این کار باعث می‌شود TypeScript خطاهای احتمالی را قبل از اجرا تشخیص دهد.

تفاوت Type Alias و Interface

بسیاری از توسعه‌دهندگان این سؤال را می‌پرسند:

Type Alias بهتر است یا Interface؟

Interface

interface User {
  name: string;
}

Type Alias

type User = {
  name: string;
};

برای تعریف Object هر دو تقریباً مشابه هستند.

اما Type Alias قابلیت‌های بیشتری دارد:

• تعریف Union Type
• تعریف Primitive Type
• تعریف Function Type
• تعریف Tuple Type

مثال:

type Status =
  | "loading"
  | "success"
  | "error";

این کار با Interface امکان‌پذیر نیست.

اشتباهات رایج هنگام استفاده از Type Alias

تعریف نام‌های مبهم

بد:

type Data = {};

خوب:

type UserProfile = {
  name: string;
};

استفاده بیش از حد

برای هر متغیر ساده Alias نسازید.

بد:

type Age = number;

خوب:

فقط زمانی که مفهوم خاصی ایجاد می‌کند از Alias استفاده کنید.

انتخاب نام‌های غیرمعنادار

نام Type باید دقیقاً بیانگر کاربرد آن باشد.

مثال خوب:

type HotelReservation = {
  ...
}

بهترین روش استفاده از Type Alias

در پروژه‌های بزرگ:

• تمام Type ها را در فایل‌های جداگانه قرار دهید.
• نام‌های واضح و توصیفی انتخاب کنید.
• برای Union Types همیشه از Alias استفاده کنید.
• از تکرار ساختارهای مشابه جلوگیری کنید.

جمع‌بندی

Type Alias یکی از مهم‌ترین قابلیت‌های TypeScript است که به شما اجازه می‌دهد نوع‌های سفارشی و قابل استفاده مجدد ایجاد کنید.

مزایای اصلی:

• افزایش خوانایی کد
• کاهش تکرار
• نگهداری آسان‌تر پروژه
• تعریف Union Type
• تعریف Function Type
• ساخت مدل‌های داده استاندارد

در پروژه‌های حرفه‌ای Angular، React و Node.js تقریباً همیشه از Type Alias برای مدیریت مدل‌های داده و ساختارهای پیچیده استفاده می‌شود.

سوالات متداول (FAQ)

Type Alias چیست؟

روشی برای تعریف نام سفارشی برای یک نوع داده در TypeScript است.

چه زمانی از Type Alias استفاده کنیم؟

زمانی که یک نوع پیچیده یا تکراری در چند بخش پروژه استفاده می‌شود.

تفاوت Type Alias و Interface چیست؟

Interface بیشتر برای Objectها استفاده می‌شود اما Type Alias قابلیت تعریف Union Type، Function Type و Primitive Type را نیز دارد.

آیا Type Alias عملکرد برنامه را تغییر می‌دهد؟

خیر. Type Alias فقط در زمان توسعه و بررسی نوع داده‌ها توسط TypeScript استفاده می‌شود و در JavaScript نهایی وجود ندارد.

دسترسی به ویدیوهای کامل دوره

برای مشاهده ویدیوهای کامل هر جلسه، دریافت تمرین‌ها، فایل‌ها و پشتیبانی، می‌توانید دوره کامل را تهیه کنید.