تایپ اسکریپت (به انگلیسی: TypeScript) یک زبان برنامهنویسی چندسکویی، متن باز و کامپایلری است که توسط شرکت مایکروسافت توسعه داده شده و پشتیبانی میشود. تایپ اسکریپت یکی از زیر مجموعههای زبان جاوا اسکریپت است که به شما کمک میکند تا کدهای خود را به روش سادهتری نوشته و سپس با کامپایل کردن آنها خروجی استاندارد کد جاوا اسکریپت را به دست آورید. امکانات پیشرفتهای که مایکروسافت به تایپ اسکریپت افزوده است، آن را به زبانهایی مانند #C، جاوا و... نزدیک ساخته است. تایپ اسکریپت برای توسعهی پروژههای بزرگ جاوا اسکریپت طراحی شده است و فرآیند توسعه را تا حد زیادی ساده میکند. امروزه تایپ اسکریپت به یکی از محبوبترین زبانهای دنیا تبدیل شده است و روز به روز افراد بیشتری را به خود جذب میکند. اما ممکن است این سوال برای شما نیز پیش آید که چرا باید تایپ اسکریپت را یاد بگیریم و استفاده و یادگیری آن چه مزایایی به همراه دارد؟ در ادامهی این مقاله به این سوالات پاسخ خواهیم داد و زبان تایپ اسکریپت و مزایای آن را به شما معرفی خواهیم کرد، با ما همراه باشید.
چرا باید تایپ اسکریپت را یاد بگیریم؟
ممکن است این سوال برای توسعهدهندگان پیش آید که چرا با وجود زبان قدرتمندی مانند جاوا اسکریپت، نیاز به زبان دیگری مانند تایپ اسکریپت داریم. مزایای استفاده از زبان تایپ اسکریپت زمانی برای ما آشکارتر میشود که در پروژههای بزرگ ملزم به استفاده از جاوا اسکریپت باشیم. TypeScript به عنوان Superset زبان جاوا اسکریپت ارائه شده و هدف آن کدنویسی آسان با کمترین میزان خطا و استفاده از ویژگیهای پیشرفتهی زبانهای شیگرا، جهت نوشتن برنامههای سمت سرور و سمت کاربر است. از طرفی، با توجه به سرعت بالای رشد و توسعهی زبانهای تحت وب، مرورگرها برای پشتیبانی و انتشار ویژگیهای جدید در موتورهای خود، به مدت زمانی نسبتا طولانی نیاز دارند. اینجاست که بار دیگر TypeScript کارآیی خود را نشان میدهد. TypeScript با کتابخانههای محبوب جاوا اسکریپت مانند ReactJS و JQuery سازگار است و پس از کامپایل، میتوانید اطمینان حاصل کنید که خروجی نهایی کد شما با انواع مرورگرها سازگار خواهد بود. تایپ اسکریپت برای توسعهی برنامههای AngularJS 2 توصیه شده است. بنابراین اگر علاقهمند به توسعهی وب اپلیکیشنهای خود با این فریمورک هستید، میبایست ابتدا تایپ اسکریپت را فرا بگیرید زیرا برای نوشتن کدهای JavaScript درون انگولار از کدهای زبان TypeScript استفاده میشود. اگر اکنون با جاوا اسکریپت آشنایی دارید، مهاجرت به TypeScript برای شما مشکلساز نخواهد بود؛ زیرا سینتکس TypeScript شباهت زیادی با Javascript و EC6 دارد و تمامی کدهای جاوا اسکریپت موجود، در تایپ اسکریپت معتبر شناخته میشوند. حتی میتوانید با تغییر پسوند فایلها از js به ts، از آنها به عنوان کدهای تایپاسکرپیت استفاده کنید.
محبوبیت TypeScript
براساس بررسی Stack Overflow Developer در سال 2018، TypeScript به عنوان یک زبان برنامه نویسی، توانسته است محبوبیت بیشتری نسبت به JavaScript به دست آورد. محبوبیت TypeScript در بین توسعه دهندگان JavaScript به این دلیل است که این زبان به شما این امکان را میدهد تا خطاها را قبل از اجرای کد خود مشاهده کنید؛ این قابلیت موجب میشود تا فرآیند خطایابی و رفع آن در زمان کوتاهی انجام شده و تا حد زیادی ساده و آسانتر شود. همچنین به برنامهنویسان این امکان را میدهد تا کدهایی تمیز بنویسند.
شروع کار با TypeScript
ما در این مقاله قصد نداریم به آموزش تایپ اسکریپت بپردازیم و تنها نحوهی شروع به برنامهنویسی و مفاهیم مقدماتی آن را توضیح میدهیم.
نصب TypeScript
دو روش برای دستیابی به ابزارهای TypeScript وجود دارد که عبارتند از:
با استفاده از npm (js package manager)
با نصب پلاگینهای تایپ اسکریپت ویژوال استودیو
نسخههای 2015 و 2017 ویژوال استودیو به طور پیشفرض شامل TypeScript هستند. اگر هنوز TypeScript را روی ویژوال استودیوی خود نصب کردهاید، میتوانید آن را از اینجا دریافت کنید. دستور نصب تایپاسکرپیت برای کاربران npm:
npm install -g typescript
ابتدا فایل TypeScript خود را با نام greeter.ts ایجاد کنید و قطعه کد زیر را در آن قرار دهید:
function greeter(person) {
return "Hello, " + person;
}
var user = "Jane User";
document.body.innerHTML = greeter(user);
ما در این فایل از پسوند .ts استفاده کردیم؛ اما این کد تنها جاوا اسکریپت است و شما میتوانید آن را کپی کرده و در برنامههای موجود جاوا اسکریپت از آن استفاده کنید. سپس، در خط فرمان خود کامپایلر تایپاسکرپت را با دستور زیر اجرا کنید:
tsc greeter.ts
نتیجه یک فایل greeter.js خواهد بود که درون آن همان کدهای جاوا اسکریپتی که ابتدا در فایل .ts قرار دادیم، قرار دارند.
مشخص کردن نوع متغیرها در TypeScript
انواع اصلی در TypeScript عبارتند از: String, Number, Boolean, Null, Undefined, Symbol و Void. در این زبان تمامی اعداد (صحیح و اعشاری و...) از نوع number هستند. کلاسها، آرایهها، توابع و آبجکتها نیز انواع فرعی در این زبان هستند. در این زبان 2 روش با نامهای Type Annotation و Type Inference برای تعیین نوع متغیرها وجود دارد که در ادامه به آنها میپردازیم.
Type Annotation
در این روش، برنامهنویس در ابتدا از نوع دادهی مورد نظر آگاه است بنابراین میتواند به طور مستقیم نوع متغیر را مشخص کند. اما در صورتی که نوع دادهی مورد نظر داینامیک باشد، بهتر است که از روش بعدی استفاده شود. برای مثال:
//number
let money: number = 250;
//string
let name: string = "John Doe";
//boolean
let isValid: boolean = true;
//undefined
let nothing : undefined = undefined;
//null
let nothing : null = null;
//built in object
let data: Date = new Date();
//Array
let listNumbers: number[] = [1,2,3];
let colors: string[] = [red, blue, green];
let isPower_ON: boolean[] = [true, false, true, true];
//classes
class Door{
//some code here
}
let door: Door = new Door();
//object literal
let point: {x:number, y:number} = {
x: 10, //if you type string or other types you got error
y: 15
};
//Function
const printIndex: (i: number) =˃ void = (i: number) =˃ {
console.log(i);
};
Type Inference
در این روش، نوع داده توسط برنامهنویس تعیین نمیشود و این تایپ اسکریپت است که وظیفهی تعیین نوع متغیرها را بر عهده دارد. به این صورت که بنا بر مقداری که به متغیر اختصاص داده میشود، نوع آن توسط تایپ اسکریپت به آن متغیر اختصاص داده خواهد شد. برای نمونه در مثال زیر نوع دادهای که به متغیر color اختصاص داده میشود، از نوع string خواهد بود.
Let color = “blue”;
تعریف کلاس در تایپ اسکریپت
یکی از ویژگیهای اپلیکیشنهای بزرگ مقیاس، استفاده از ویژگیهای برنامهنویسی شیگرا از جمله کلاس است. سایر ویژگیهای برنامهنویسی شیگرا مانند ارثبری، setters، getters، interfaces، abstract و... نیز در تایپ اسکریپت قابل پیادهسازی هستند. قطعه کد زیر نمونهای از تعریف کلاس در TypeScript است. اگر با زبانهای جاوا یا C# آشنایی داشته باشید، سینتکس آن برای شما آشنا خواهد بود. در این کد کلاسی با نام Greeter تعریف شده است که دارای سه عضو میباشد؛ یک property با نام greeting، یک سازنده و یک متد greet.
class Greeter {
greeting: string;
constructor(message: string) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
} }
let greeter = new Greeter("world");
Interfaces ،Generics ,Inheritance و Method Access Modifiers در تایپ اسکریپت
زبان TypeScript از Interfaces ،Generics ,Inheritance و Method Access Modifiers پشتیبانی میکند. Interface روش خوبی برای عقد یک قرارداد است. به بیان دیگر میتوان گفت که اینترفیسها عملکرد خاصی ندارند و ما با استفاده از آنها در کد برنامهی خود، به نحوی قول میدهیم که در کلاسی که از آن اینترفیس خاص استفاده میشود، از کلیهی متدهایی که در داخل آن اینترفیس قرار گرفتهاند، استفاده خواهیم کرد. برای روشنتر شدن این مطلب، به مثالی از اینترفیسها در زبان تایپ اسکریپت میپردازیم:
interface ITax {
taxpayerId: string;
calculateTax(): number;
}
class IncomeTax implements ITax {
taxpayerId: string;
calculateTax(): number {
return 10000;
}
}
class ServiceTax implements ITax {
taxpayerId: string;
calculateTax(): number {
return 2000;
}
}
Generic به شما این امکان را میدهد که متد یا کلاسی تعریف کنید که نوع نداشته باشد و نوع دادهی استفاده شده در متد یا کلاس را زمانی مشخص کنید که به دادهی موردنظر در زمان اجرای برنامه نیاز داشته باشید. نحوهی استفاده از جنریک در تایپ اسکریپت به صورت زیر است:
function identity<T> (arg: T): T {
return arg;
}
//example showing implementation of generics
let output = identity <string>("myString");
let outputl = identity <number> (23);
وراثت یکی از ویژگیهای کلیدی برنامه نویسی شی گرا است. این ویژگی به ما این امکان را میدهد تا کلاسهای جدیدی بر پایهی کلاسهای موجود ایجاد کنیم به گونهای که کلاسهای فرزند میتوانند در عین حال که ویژگیهای کلاس والد را به ارث میبرند، ویژگیهای منحصر به فرد خود را نیز داشته باشند. مثال زیر نحوهی استفاده از وراثت در تایپ اسکریپت را به خوبی نشان داده است:
class Employee{
Firstname:string;
}
class Company extends Employee {
Department:string;
Role:string
private AddEmployee(){
this.Department="myDept";
this.Role="Manager";
this.FirstName="Test";
// do the operation
}
}
تغییردهندههای دسترسی یا Access Modifiers مشخص میکنند که چه بخشهایی از کد، مجاز به دسترسی به یک المان مشخص هستند. TypeScript دارای دو تغییردهندهی دسترسی عمومی و خصوصی است. به طور پیش فرض، تمامی اعضا عمومی هستند اما میتوانید همانند مثال زیر، به طور صریح یک تغییردهندهی عمومی یا خصوصی را به آنها اضافه کنید.
class Customers{
public companyname:string;
private country:string;
}
جمعبندی
اگر کدنویسی با زبان TypeScript را تجربه نکردهاید، به شما توصیه میکنیم که آن را امتحان کنید. تایپ اسکریپت به شما به عنوان یک توسعهدهندهی جاوا اسکریپت این امکان را میدهد تا به روشی ساده کدهایی بنویسید که قابل اجرا بر روی تمامی مرورگرها باشد و به راحتی بتوانید کدهای خود را خطایابی کرده و خطاهای موجود را رفع کنید. این بدان معناست که کدنویسی با زبان تایپ اسکریپت، مدیریت کدهای شما را سادهتر خواهد کرد. تجربهی شما از کدنویسی با تایپ اسکریپت چیست؟ آیا استفاده و یادگیری این زبان را ضروری و مفید میدانید؟ تجربیات خود را با ما به اشتراک بگذارید.
اگر به یادگیری بیشتر در زمینه جاوا اسکریپت علاقه داری، با شرکت در دوره آموزش جاوا اسکریپت در کمتر از یکسال به یک متخصص JS همه فن حریف تبدیل میشوی که آمادهی استخدام، دریافت پروژه و یا فول-استک شدن هستی.
۱۷ دیدگاه
امیر۱۳ فروردین ۱۴۰۳، ۱۳:۰۶
سلام و خسته نباشید .
وقتی درون این وبسایت کامنت میزارین کامنتها درون باکس بیرون میزند و به سختی قابل مشاهده هست.چرا؟
نازنین کریمی مقدم۰۲ تیر ۱۴۰۳، ۰۸:۱۹
درود
چون قالب جدید تازه بالا اومده و دوستان هنوز مشغول پیاده سازی و رفع معایب هستند.
ممنون که با ما همراه هستید.
۲۲ شهریور ۱۴۰۲، ۱۲:۴۲
سلام مقاله کامل و عالی بود،
یک سوال دارم برای ساخت کامنت باکس مثل همین سایت چطور باید به این گونه طراحیش کرد؟
آیا به غیر از js بایدزبان دیگری هم در ساخت این کامنت باکس بکار گرفت یا استفاده از Mysql؟
میشه راهنماییم کنید،
با تشکر ❤️
نازنین کریمی مقدم۲۴ مهر ۱۴۰۲، ۱۰:۳۲
درود
برای طراحی ظاهر و اتصال به پایگاه داده باید از html و css و js استفاده کنید.
برای اینکه پیامها در سمت سرور ذخیره بشن باید از پایگاه داده مثل sql و... کمک بگیرید.
۰۵ شهریور ۱۴۰۲، ۲۰:۱۸
بنظرم جاوا اسکریپت یکی از برترین زبانهای برنامه نویسی و توسعه وب است که زبانهای دیگری مشابه خود را دارد و برنامه نویسی را آسانتر کرده
نازنین کریمی مقدم۰۶ شهریور ۱۴۰۲، ۰۵:۳۴
درود بر شما
با نظرتون خیلی موافقم :)
۰۵ شهریور ۱۴۰۲، ۰۹:۴۵
از تایپ اسکریپت متنفرم.
امیدوارم با نابودی انگولار، تایپ اسکریپت هم به زباله دان تاریخ بره
نازنین کریمی مقدم۰۵ شهریور ۱۴۰۲، ۱۲:۰۲
درود
چرا آخه؟ :)
عباس باقری۲۱ اسفند ۱۴۰۱، ۲۰:۲۷
سلام دوره تایپ اسکریپتم داره سون لرن؟؟
نازنین کریمی مقدم۲۱ اسفند ۱۴۰۱، ۲۰:۴۰
درود
در حال حاضر خیر . دوره الگوهای طراحی در تایپ اسکریپت رو داریم که بعد از یادگیری مبانی تایپ اسکریپت باید سراغش بیاید.
۳۰ آذر ۱۴۰۰، ۰۶:۳۲
سلام بهترین منبع فارسی برای یادگیری typescriptچیست؟
نازنین کریمی مقدم۳۰ آذر ۱۴۰۰، ۰۷:۲۳
سلام
حقیقتا جز دورههای خودمون و منابع انگلیسی، نمیدونم اوضاع منابع فارسی به چه شکلی هست و کدوم بهتره،
اما توجه داشته باشید که بعضی تایپ اسکریپت رو براساس منطق ری اکتی و جاوا اسکریپتی آموزش میدهند و بعضی برطبق منطق انگولاری، سرفصلهای دوره هایی که میبینید رو براساس نیازتون چک کنید و بعد خرید بفرمایید.
علیرضا کمالی۱۴ تیر ۱۴۰۰، ۱۹:۳۶
با عرض سلام و احترام . میخواستم خدمت شما عرض کنم که آموزش کامل تایپ اسکریپت از کجا میتوانم تهیه کنم.تشکر
نازنین کریمی مقدم۰۳ مرداد ۱۴۰۰، ۲۰:۲۷
سلام. بابت تاخیر در پاسخگویی از شما پوزش میطلبم.
بنده از <a href="https://www.typescripttutorial.net/" target="_blank" rel="noopener nofollow ugc">typescripttutorial.net</a> استفاده کردم و بنظرم کامل هست.
رادین حیدری۲۵ آذر ۱۳۹۹، ۰۶:۱۷
سلام.خسته نباشید.ببخشید من ۱۵ سالمه و میخوام بازی سازی و شروع کنم ایا type script یا java script برای بازی سازی مناسب هستند؟ و اینکه شما چه زبانی رو توصیه میکنید؟
البته بگم من کد نویسی اصلا بلد نیسنم.
نازنین کریمی مقدم۲۵ آذر ۱۳۹۹، ۰۷:۱۵
درود.
برای بازی سازی ما یسری مقالات با تگ توسعه بازیهای کامپیوتری داریم و مهمترین مقاله <a href="https://7learn.com/blog/game-development-roadmap" rel="noopener noreferrer" target="_blank">نقشه راه بازی سازی</a> هست که میتونید مطالعه کنید.
در مورد انتخاب زبان، بستگی به محیطی داره که قرار هست توش بازی بسازید و به اصطلاح بهش موتور بازی گفته میشه. یونیتی از جاوا اسکریپت پشتیبانی میکنه اما بنظرم سی شارپ بهتره. تایپ اسکریپت هم فعلا برا بازی سازی مناسب نیست و به درد طراحی وب میخوره.
شما مقاله <a href="https://7learn.com/blog/game-engines" rel="noopener noreferrer" target="_blank">موتور بازی سازی </a>رو هم بببینید که تو انتخاب زبان بدردتون میخوره.
هرجایی سوال داشتید میتونید زیر پستهای مقالات بازی مون بپرسید حتما کمک تون میکنیم.
محسن محمدی رهنما۲۲ اردیبهشت ۱۳۹۹، ۱۹:۰۰
سلام ممنون بابت مقاله عالی تون.
راهنمای مقاله
چرا باید تایپ اسکریپت را یاد بگیریم؟
محبوبیت TypeScript
شروع کار با TypeScript
مشخص کردن نوع متغیرها در TypeScript
تعریف کلاس در تایپ اسکریپت
Interfaces ،Generics ,Inheritance و Method Access Modifiers در تایپ اسکریپت
جمعبندی
راهنما و فهرست مقاله
چرا باید تایپ اسکریپت را یاد بگیریم؟
محبوبیت TypeScript
شروع کار با TypeScript
مشخص کردن نوع متغیرها در TypeScript
تعریف کلاس در تایپ اسکریپت
Interfaces ،Generics ,Inheritance و Method Access Modifiers در تایپ اسکریپت