TypeScript چیست؟

مقدمه

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

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

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

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

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

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

1.Type annotations

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

let name: string = "Hygraph

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

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

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

تایپ استاتیک

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

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

let name: string = "hygraph";
name = 2000

تایپ اختیاری

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

let name = "Hygraph";

// 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[] = [1, 2, 3, 4, 5];
console.log(getArrayLength(stringArray)); // Output: 3
console.log(getArrayLength(numberArray)); // Output: 5

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

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

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

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

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

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

let age = number | string;
age = 10;
age = "ten";

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

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

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

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

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

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

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

انواع شرطی در 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 استفاده می کنند که بررسی می کند آیا یک نوع شرایط خاصی را برآورده می کند یا خیر و بر اساس نتیجه آن شرط نوع دیگری تولید می کند.

4. انواع 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: 1 };
// Property 'email' is now optional
optionalUser.username = "john_doe";
// Property 'id' is still required
// optionalUser.email = "[email protected]"; // Error: Property 'email' is missing

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

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

نام مستعار نوع اجازه می دهد تا نام های سفارشی (نام مستعار) برای انواع 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: 0, y: 0 };
const greet: Greeting = (name) => Hello, ${name}!;

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

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

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

1. کلاس های 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", 2015);
console.log(organization.name); // Error: Property 'name' is private and only accessible within class 'Organization'.
console.log(organization.getDetails()); // Output: Hygraph was founded in 2015

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

2. رابط TypeScript

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

// Interface representing form data
interface FormData {
firstName: string;
lastName: string;
email: string;
age: number;
}
// Usage
let formData: FormData = {
firstName: "John",
lastName: "Doe",
email: "[email protected]",
age: 30
};

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

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

شماره های TypeScript

انواع Enumerate، که با enum در TypeScript نشان داده می‌شوند، مجموعه‌ای از ثابت‌های نام‌گذاری‌شده در پرانتزهای مجعد {} هستند، که در آن هر ثابت دارای یک مقدار عددی یا رشته‌ای مرتبط است.

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

// enum for days of the week
enum DayOfWeek {
Sunday,
Monday,
Tuesday,
Wednesday,
Thursday,
Friday,
Saturday
}
enum HTTPStatusCodes { 
OK = 200, 
BadRequest = 400, 
NotFound = 404,
}

بلوک کد بالا بلافاصله آنچه را که اتفاق می‌افتد توضیح می‌دهد و مزیت معنایی افزودن معنی استفاده از enums TypeScript را نشان می‌دهد.

TypeScript و ES6

TypeScript از بسیاری از ویژگی های ECMAScript 6 (ES6) پشتیبانی می کند که به عنوان ECMAScript 2015 نیز شناخته می شود. برخی از این ویژگی ها عبارتند از:

1) توابع پیکان: برخلاف عبارات تابع سنتی، توابع فلش یک نحو ساده برای تعریف توابع ارائه می دهند. آنها یک بازگشت ضمنی برای عبارات تک خطی و اتصال خودکار آن ارائه می دهند و می توانند برای توابع پاسخ به تماس یا کنترل کننده رویداد مفید باشند.

// Arrow function
const add = (x, y) => x + y;
// Traditional function expression
const add = function(x, y) {
return x + y;
};

2) الفبای الگو: این اجازه می دهد تا عبارات و رشته های چندخطی را مستقیماً در بکتیک (“) در کد جاسازی کنید. این امر ایجاد رشته های پویا، از جمله درونیابی متغیرها و عبارات را آسان می کند.

const name: string = "John";
const greeting: string = `Hello, ${name}!`;

ویژگی های ES6 بیش از آنچه این مقاله می تواند بررسی کند وجود دارد. برای کسب اطلاعات بیشتر به Ecma International مراجعه کنید.

مزایای TypeScript نسبت به جاوا اسکریپت

از زمان انتشار تایپ اسکریپت بیش از یک دهه پیش، بحث های مداومی در مورد مزایای آن نسبت به جاوا اسکریپت وجود داشته است.

در این بخش به بررسی برخی از این مزایا می پردازیم.

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

زمان استفاده از TypeScript

از مبادلاتی که در بالا بررسی شد، می توانید استنباط کنید که TypeScript ممکن است برای همه پروژه ها مناسب نباشد. این ممکن است درست باشد، اما چرا این تصمیم را به شما واگذار می کنیم؟ بیایید به شما کمک کنیم تصمیم بهتری بگیرید.

چه زمانی استفاده از TypeScript مناسب است؟

• برنامه های کاربردی در مقیاس بزرگ: TypeScript برای رسیدگی به مشکلات مقیاس پذیری پایگاه های کد بزرگ جاوا اسکریپت توسعه داده شد. همانطور که پروژه رشد می کند، تایپ استاتیک به تشخیص زودهنگام خطاها کمک می کند و قابلیت نگهداری کد و همکاری بین اعضای تیم را بهبود می بخشد.
• همکاری تیمی: در یک محیط تیمی با چندین توسعه‌دهنده که در یک پایگاه کد مشارکت می‌کنند، TypeScript می‌تواند همکاری را با اجرای قراردادهای کدنویسی و برقراری ارتباط بهتر از طریق کدهای خود مستندسازی تسهیل کند.
• پروژه های بلندمدت: تعمیر و نگهداری آخرین مرحله از چرخه عمر توسعه نرم افزار است و می تواند یک دهه یا کوتاه مدت یک سال طول بکشد. TypeScript برای پروژه های طولانی مدت که در آن نگهداری کد، مقیاس پذیری و محافظت از آینده ملاحظات ضروری هستند، مناسب است.

چه زمانی از TypeScript استفاده نکنید

متأسفانه، با وجود مزایایی که دارد، TypeScript ممکن است برای همه موارد استفاده مناسب نباشد. مانند:

• پروژه های ساده: برای پروژه های کوچک با حداقل پیچیدگی، مزایای تایپ استاتیک و ابزار پیشرفته ممکن است بیشتر از پیکربندی و منحنی یادگیری مرتبط با TypeScript نباشد.
• پایگاه های کد قدیمی: تبدیل پایگاه های کد بزرگ و موجود جاوا اسکریپت به TypeScript می تواند دلهره آور باشد. در چنین مواردی، تلاش لازم برای مهاجرت به TypeScript ممکن است مزایا را توجیه نکند، به ویژه اگر پروژه به پایان عمر خود نزدیک می شود یا حداقل تعمیر و نگهداری را پشت سر می گذارد.