TypeScript چیست؟

مقدمه

TypeScript یک زبان برنامه نویسی همه منظوره است که در محیط های مختلف توسعه استفاده می شود. در طول سال‌ها پس از انتشار، پشتیبانی زیادی از توسعه‌دهندگان و شرکت‌ها به دست آورده است که نشان می‌دهد GitHub آن را به عنوان چهارمین زبان برنامه‌نویسی پرکاربرد خود در سال ۲۰۲۲ رتبه‌بندی کرده است. از آن زمان برجستگی TypeScript افزایش یافته است.

علاوه بر این، محبوبیت آن در فراوانی فرصت‌های شغلی منعکس شده است، با بیش از ۲۰۰۰۰ موقعیت شغلی مرتبط با TypeScript که در لینکدین تبلیغ می‌شود و بازیگران اصلی صنعت، از جمله Trivago و Stripe، ترجیح می‌دهند پشته‌های فناوری خود را به TypeScript منتقل کنند.

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

TypeScript در مقابل جاوا اسکریپت

TypeScript کاملاً جدید نیست. این ابر مجموعه ای از جاوا اسکریپت است که با محدودیت های خود جاوا اسکریپت مقابله می کند. به عنوان یک ابر مجموعه، TypeScript با اضافه کردن تایپ ایستا، جاوا اسکریپت را گسترش می دهد.

این تایپ استاتیک را می توان به دو روش رایج اعلام کرد:

۱.Type annotations

این شامل تعیین فوری متغیرها و نوع آنها در اولین بار اعلام متغیر است. اینطوری:

let name: string = "Hygraph

جایی که name نام متغیر و رشته نوع آن است.

۲. Type aliases

این روش شامل تعریف یک نوع به طور جداگانه با استفاده از کلمه کلیدی type و بعداً استفاده از آن برای حاشیه نویسی متغیرها است.

type StringType = {
name: string;
};
let name: StringType = { name: "Hygraph" };

حال، اجازه دهید به برخی از ویژگی هایی که TypeScript ارائه می دهد نگاهی بیندازیم.

ویژگی های برتر TypeScript

تایپ استاتیک

تایپ استاتیک به زمانی اشاره دارد که متغیرها به طور صریح با انواع داده های خود (مانند عدد صحیح، رشته، بولی) در زمان کامپایل اعلام می شوند و سیستم قبل از اجرای برنامه، بررسی نوع را انجام می دهد.

در حالی که رفتار زیر در جاوا اسکریپت مجاز است، انجام همین کار در TypeScript به دلیل اعمال نوع TypeScript باعث خطا می شود.

let name: string = "hygraph";
name = ۲۰۰۰

تایپ اختیاری

در حالی که TypeScript اجازه اعلان متغیر صریح را می دهد، از نوشتن کدهای جاوا اسکریپت مانند بدون اعلان انواع نیز پشتیبانی می کند. TypeScript نوع را از جعبه استنتاج می کند. به عنوان مثال،

let name = "Hygraph";

در بالا، TypeScript استنباط می کند که نام نوع یک رشته از طریق مقدار مقدار دهی اولیه متغیر است، به عنوان مثال، “Hygraph”.

ژنریک TypeScript

با پارامترسازی انواع و توابع، ژنریک های TypeScript اجزا و توابع قابل استفاده مجدد ایجاد می کنند که می توانند با انواع مختلف بدون به خطر انداختن ایمنی نوع کار کنند:

// Generic function to return the length of an array
function getArrayLength<T>(array: T[]): number {
return array.length;
}
// Using the generic function with different types of arrays
const stringArray: string[] = ["apple", "banana", "orange"];
const numberArray: number[] = [۱, ۲, ۳, ۴, ۵];
console.log(getArrayLength(stringArray)); // Output: ۳
console.log(getArrayLength(numberArray)); // Output: ۵

ژنریک ها به طور کلی برای تعریف انواع داده های سفارشی مفید هستند که باید با انواع داده ها مانند درختان، نمودارها و صف ها کار کنند.

سیستم نوع پیشرفته

سیستم نوع TypeScript فراتر از تایپ استاتیک اولیه است. همچنین ویژگی هایی را برای تعریف انواع پیچیده، دستکاری انواع، برقراری روابط بین متغیرها، اعمال محدودیت های نوع و سایر قابلیت ها فراهم می کند که امکان توسعه برنامه های کاربردی بدون خطا را فراهم می کند.

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

۱. انواع اتحادیه

Union در TypeScript به اعلان یک متغیر یا آرگومان تابعی اشاره دارد که انواع داده های متعددی را در خود نگه می دارد. این می تواند زمانی مفید باشد که یک مقدار دارای انواع داده های مختلف در زمان اجرا باشد.

انواع اتحادیه با | نشان داده می شوند نماد، که انواع داده ها را از هم جدا می کند. به عنوان مثال:

let age = number | string;
age = ۱۰;
age = "ten";

همانطور که در بالا مشاهده شد، می‌توانیم مشخص کنیم که متغیر سن می‌تواند دارای دو نوع داده باشد. این انعطاف پذیری را بدون به خطر انداختن ایمنی نوع فراهم می کند.

۲. انواع تقاطع

تقاطع ها با ترکیب چندین نوع موجود در یک نوع جدید، امکان ایجاد یک نوع جدید را فراهم می کنند. این نوع جدید دارای خواص و عملکردهای انواع ترکیبی است.

تقاطع ها با استفاده از نماد & بین انواعی که باید ترکیب شوند ایجاد می شوند. به عنوان مثال:

interface User {
id: number;
username: string;
email: string;
}
interface Admin {
isAdmin: boolean;
}
// A new type using intersection type
type UserAndAdmin = User & Admin;

در اینجا، نوع User AndAdmin ویژگی‌های هر دو رابط کاربری و مدیریت را ترکیب می‌کند تا نوعی را تولید کند که به همه ویژگی‌ها از هر دو نیاز دارد.

۳. انواع مشروط

انواع شرطی در TypeScript انواعی را ایجاد می‌کنند که به یک حالت بستگی دارند، که امکان تعریف انواع پویا را فراهم می‌کند که بر اساس ویژگی‌های انواع، مقادیر یا زمینه‌های دیگر تغییر می‌کنند.

اجازه دهید یک مثال اساسی را در نظر بگیریم:

// A conditional type to determine if a type is an array
type IsArray<T> = T extends any[] ? true : false;
// Test the conditional type with different types
type Result1 = IsArray<number>; // false
type Result2 = IsArray<string[]>; // true
type Result3 = IsArray<boolean | []>; // true

انواع شرطی با استفاده از دستور عملگر سه تایی (? 🙂 در براکت های زاویه ای (<>) که به عنوان “پارامتر نوع عمومی” شناخته می شود، تعریف می شوند – در ادامه مقاله در مورد آن بیشتر توضیح خواهیم داد. آنها همچنین از کلمه کلیدی extends استفاده می کنند که بررسی می کند آیا یک نوع شرایط خاصی را برآورده می کند یا خیر و بر اساس نتیجه آن شرط نوع دیگری تولید می کند.

۴. انواع Mappedn

انواع نگاشت شده در TypeScript امکان ایجاد انواع جدید را با تبدیل خصوصیات انواع موجود فراهم می کند. آنها این کار را با تکرار بر روی خصوصیات یک نوع منبع و اعمال یک تبدیل برای هر ویژگی برای تولید یک نوع جدید انجام می دهند. به عنوان مثال:

// type representing a user
type User = {
id: number;
username: string;
email: string;
};
// Mapped type to make all properties optional
type OptionalUser = { [P in keyof User]?: User[P] };
// New type using the mapped type
const optionalUser: OptionalUser = { id: ۱ };
// Property 'email' is now optional
optionalUser.username = "john_doe";
// Property 'id' is still required
// optionalUser.email = "john@example.com"; // Error: Property 'email' is missing

انواع نگاشت شده با استفاده از نحو { [P in keyof Type]: NewType } تعریف می‌شوند، که Type نوع منبع، P کلید ویژگی و NewType نوع تبدیل شده است. P روی کلیدهای ویژگی تکرار می شود و تبدیل تغییر را تعریف می کند.

۵. نام مستعار را تایپ کنید

نام مستعار نوع اجازه می دهد تا نام های سفارشی (نام مستعار) برای انواع TypeScript موجود، از جمله اولیه، انواع اتحادیه، انواع تقاطع، و حتی انواع پیچیده تر مانند لفظ شی و انواع تابع ایجاد شود. نام مستعار نوع با استفاده از کلمه کلیدی نوع و به دنبال آن نام جدید تعریف می شود، همانطور که در زیر نشان داده شده است:

// type alias for a union type
type Result = "success" | "error";
// type alias for an object literal
type Point = { x: number; y: number };
// type alias for a function type
type Greeting = (name: string) => string;
// Using the type aliases
const status: Result = "success";
const origin: Point = { x: ۰, y: ۰ };
const greet: Greeting = (name) => Hello, ${name}!;

کد بالا موارد استفاده متفاوت از نام مستعار نوع را برای انواع مختلف در TypeScript و استفاده از آنها پس از اعلان نشان می دهد.

TypeScript در برنامه نویسی شی گرا (OOP)

OOP یک پارادایم مبتنی بر مفهوم “اشیاء” است که برای ایجاد کد قابل نگهداری و قابل استفاده مجدد در تعامل هستند.

۱. کلاس های TypeScript

کلاس ها الگوها یا طرح هایی برای ایجاد اشیا هستند، یعنی داده ها (ویژگی ها) و روش ها (توابع) را تعریف می کنند.

در اینجا مثالی از نحوه اجرای کلاس در TypeScript آمده است:

class Organization {
private name: string;
private yearFounded: number;
constructor(name: string, yearFounded: number) {
this.name = name;
this.yearFounded = yearFounded;
}
public getDetails(): string {
return `${this.name} was founded in ${this.yearFounded}.`;
}
}
let organization = new Organization("Hygraph", ۲۰۱۵);
console.log(organization.name); // Error: Property 'name' is private and only accessible within class 'Organization'.
console.log(organization.getDetails()); // Output: Hygraph was founded in ۲۰۱۵

در کد بالا، یک کلاس Organisation با نام خصوصیات خصوصی و yearFounded ایجاد کردیم که فقط در کلاس “Organization” قابل دسترسی و تغییر است. به نحوه تایپ خواص و متدها توجه کنید.

۲. رابط TypeScript

اینترفیس ها شکل اشیا را با فهرست کردن ویژگی ها و روش هایی که باید داشته باشند، بدون ارائه جزئیات پیاده سازی توصیف می کنند:

// Interface representing form data
interface FormData {
firstName: string;
lastName: string;
email: string;
age: number;
}
// Usage
let formData: FormData = {
firstName: "John",
lastName: "Doe",
email: "john.doe@example.com",
age: ۳۰
};

در مثال بالا، ما یک Interface FormData تعریف کردیم که ساختار داده های فرم را نشان می دهد.

در مرحله بعد، یک شی formData با ویژگی های مربوط به تعریف رابط ایجاد کردیم.