چرا TypeScript برای برنامه های وب بزرگ عالی است؟

محبوبیت TypeScript در چند سال اخیر افزایش یافته است. Angular، یکی از بزرگترین فریمورک های فرانت اند، از TypeScript استفاده می کند. حدود 60٪ از برنامه نویسان JS در حال حاضر از TypeScript استفاده می کنند و 22٪ مایلند امتحان کنند.بنظر شما چرا؟

از لحاظ تاریخی، جاوا اسکریپت به عنوان زبان اصلی برای اسکریپت نویسی صفحات وب و برنامه ها در اینترنت بوده است. اکنون می توان از جاوا اسکریپت هم در فرانت اند و هم در بک اند با فریمورک هایی مانند Node.js و Deno استفاده کرد.

اما آیا جاوا اسکریپت برای ایجاد سیستم های بزرگ و پیچیده مانند آنچه در وب مدرن است ساخته شده است؟ جواب : خیر

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

TypeScript چیست؟

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

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

حال، دلایل اضافه کردن تایپ استاتیک به جاوا اسکریپت چه خواهد بود؟

من می توانم حداقل سه مورد را لیست کنم:

• شما می توانید از خطاهای masterfully-hidden-ninja اجتناب کنید، مانند undefined' is not a function'.
• بازسازی کد بدون شکستن قابل توجه آن آسان تر است.
• جهت گیری خود در سیستم های پیچیده و در مقیاس بزرگ دیگر یک کابوس نیست.

در واقع، یک مطالعه نشان می دهد که 15٪ از تمام اشکالات جاوا اسکریپت را می توان توسط TypeScript شناسایی کرد.

آزادی تایپ پویا اغلب منجر به اشکالاتی می شود که نه تنها کارایی کار برنامه نویس را کاهش می دهد، بلکه می تواند توسعه را به دلیل افزایش هزینه های اضافه کردن خطوط جدید کد متوقف کند.

بنابراین، شکست جاوا اسکریپت در ترکیب مواردی مانند انواع و بررسی خطاهای زمان کامپایل، آن را به یک انتخاب بد برای کد سمت سرور در شرکت‌ها و پایگاه‌های کد بزرگ تبدیل می‌کند. همانطور که tagline آنها می گوید، TypeScript جاوا اسکریپتی است که مقیاس می شود.

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

TypeScript در اصل یک لینتر JS است. یا، JS با مستنداتی که کامپایلر بتواند آن را درک کند.

بنابراین، برخلاف سایر زبان‌ها مانند CoffeeScript (که قند ترکیبی اضافه می‌کند) یا PureScript (که اصلا شبیه جاوا اسکریپت نیست)، برای شروع نوشتن کد TypeScript نیازی به یادگیری چیزهای زیادی ندارید.

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

آیا تایپ اسکریپت در فرانت اند استفاده می شود یا بک اند؟

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

جاوا اسکریپت محبوب ترین زبان برای پیاده سازی اسکریپت برای قسمت فرانت اند برنامه ها و صفحات وب است. بنابراین، TypeScript را می توان برای همان هدف مورد استفاده قرار داد، اما در پروژه های سازمانی پیچیده در سمت سرور می درخشد.

در آنوفل نیز ، بیشتر قسمت های وب ما بر اساس TypeScript پیاده سازی می شود.

انواع چیست و چگونه در TS کار می کنند؟

معرفی مختصر انواع

تایپ ها روشی برای تشخیص برنامه های صحیح از نادرست قبل از اجرای آنها با توضیح در کد ما هستند که چگونه می خواهیم از داده های خود استفاده کنیم. آنها می توانند از انواع ساده مانند Number و String تا ساختارهای پیچیده که کاملاً برای دامنه مشکل ما مدل شده اند متفاوت باشند.

زبان های برنامه نویسی به دو دسته تقسیم می شوند: تایپ استاتیک یا تایپ پویا.

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

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

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

به دلیل تایپ ایستا TypeScript، باید بیشتر تلاش کنید تا:

• معرفی متغیرهای تعریف نشده (کمک هشدارهای زمان کامپایل)
• مجموع دو رشته که دارای اعداد هستند (مانند"420" = "4" + "20")
• انجام عملیات بر روی چیزهایی که اجازه آنها را نمی دهد، مانند کوتاه کردن یک عدد.

با سیستم های نوع استاتیک، می توانید انواع ترکیبی خود را ایجاد کنید. این امر مهندسان را قادر می سازد تا مقاصد خود را با جزئیات بیشتری بیان کنند.

انواع صریح همچنین کد شما را مستندسازی می‌کنند: آنها مطمئن می‌شوند که متغیرها و توابع شما با آنچه در نظر گرفته شده است مطابقت دارند و رایانه را قادر می‌سازند تا از به خاطر سپردن مراقبت کند.

برای آشنایی با چگونه تایپ اسکریپت در نوشتن کد ها بهتر کمک می کند این مقاله را بررسی کنید.

انواع در TypeScript

TypeScript انواع مختلفی دارد، مانند Boolean، Number، String، Array، Tuple و غیره. برخی از اینها در JS وجود ندارند. می توانید در مستندات TypeScript درباره آنها اطلاعات بیشتری کسب کنید.

علاوه بر آن ها، در اینجا چند نوع دیگر وجود دارد که می خواهیم برای نشان دادن بیانی TS ارائه دهیم:

Any & Unknown

در حالی که هر نوع می تواند هر چیزی را که شما بخواهید پوشش دهد، unknown همتای ایمن آن است.

هر زمان که بخواهید از نوع سیستم فرار کنید، any به شما امکان می دهد هر متغیر جاوا اسکریپت را به آن اختصاص دهید. اغلب برای مدل‌سازی متغیرهای ورودی (مثلاً از APIهای شخص ثالث) که هنوز بررسی نشده‌اند و نوع آنها ناشناخته است استفاده می‌شود.

Unknown

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

Void

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

Never

never نوع بازگشتی برای چیزی است که هرگز نباید رخ دهد، مانند تابعی که یک استثنا ایجاد می کند.

Intersection & Union types

اینها به شما امکان می‌دهند تا انواع سفارشی را برای تطابق بهتر با منطق خود ایجاد کنید.

انواع union به شما امکان می دهد چندین نوع اصلی را در یک نوع کنار هم قرار دهید. برای مثال، می‌توانید یک نوع سفارشی Person ایجاد کنید که دارای name: string و phone_number: number باشد. معادل این است که بگوییم: می خواهم تیپ من این و آن باشد.

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

اگر در مورد انواع به عنوان فضا فکر می کنید، همه این انواع به سرعت معنا پیدا می کنند.

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

با این حال، نوشتن صریح آنها مزایایی مانند کمک به توسعه دهندگان دیگر که کد شما را می خوانند و اطمینان از اینکه آنچه می بینید همان چیزی است که کامپایلر می بیند، به همراه دارد.

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

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

از هیچ جا، TypeScript اکنون در جایگاه ششم در درخواست های pull GitHub برای Q2 2021، بالاتر از PHP و C قرار دارد.

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

3 دلیل برای اینکه چرا باید TypeScript را به جای جاوا اسکریپت انتخاب کنید
 

1. TypeScript قابل اعتمادتر است

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

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

2. TypeScript واضح تر است

صریح ساختن انواع، توجه ما را بر چگونگی ساخت سیستم ما و نحوه تعامل بخش های مختلف آن با یکدیگر متمرکز می کند. در سیستم های مقیاس بزرگ، مهم است که بتوانیم بقیه سیستم را انتزاع کنیم و در عین حال زمینه را در ذهن داشته باشیم. انواع ما را قادر به انجام این کار می کند.

3. TypeScript و JavaScript عملا قابل تعویض هستند، پس چرا که نه؟

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

اکثر کتابخانه‌های محبوب جاوا اسکریپت دارای انواع هستند – Definitely Typed یک مخزن با انواع بسیاری از کتابخانه‌های جاوا اسکریپت مختلف است که می‌توانید از آن برای ایمن‌تر کردن تعاملات خود با آنها استفاده کنید.

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

معایب TypeScript

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

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

بنابراین، ممکن است TypeScript را برای پروژه های کوچک و نمونه های اولیه برای استفاده خود انتخاب نکنید.

تست ها در مقابل انواع

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

همچنان می‌توانید از تست واحد و تکنیک‌های پیشرفته‌تر مانند تست مبتنی بر ویژگی با TS استفاده کنید و در عین حال مزایای سیستم نوع استاتیک را حفظ کنید.

راهنمای شروع سریع TypeScript

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

کامپایلر TypeScript

برای کامپایل کردن کد TS خود، باید tsc (مخفف کامپایلر TypeScript) را نصب کنید. ساده ترین راه برای انجام آن از طریق ترمینال است. این کار را می توان به راحتی از طریق npm با استفاده از دستور زیر انجام داد:

npm install -g typescript

پس از نصب tsc، می توانید فایل های خود را با tsc filename.ts کامپایل کنید.

انتقال فایل های خود از جاوا اسکریپت به TypeScript

فرض کنید می خواهیم فایل جاوا اسکریپت زیر را به دلیل رفتار عجیب و غریب به TypeScript تغییر دهیم:

function my_sum(a, b) {
    return a + b;
    }


let a = 4; 
let b = "5";


my_sum(a, b);

هر فایل JS از نظر فنی یک فایل TypeScript معتبر است، بنابراین شما شروعی عالی دارید - فقط کافی است پسوند فایل را به .ts از .js تغییر دهید.

TypeScript دارای استنتاج نوع است، به این معنی که می تواند به طور خودکار برخی از انواع مورد استفاده شما را بدون اضافه کردن آنها استنتاج کند. در این مورد، فرض می‌شود که تابع دو متغیر از نوع any را جمع می‌کند، که درست است اما در حال حاضر کاربرد زیادی ندارد.

اگر بخواهیم فقط اعداد را جمع کنیم، می توانیم یک نوع امضا به my_sum اضافه کنیم تا فقط اعداد را بپذیرد.

function my_sum(a: number, b: number) {
    return a + b;
    }


let a = 4; 
let b = "5";


my_sum(a, b);

اکنون TypeScript یک خطا در اختیار ما قرار می دهد.

آرگومان نوع 'string' قابل انتساب به پارامتر نوع 'number' نیست.

چه خوب که متوجه شدیم خطا کجاست. :) برای فرار بیشتر از خطاهایی مانند این، می توانید تعاریف نوع را نیز به متغیرها اضافه کنید.

let b: number = "5" // Type '"5"' is not assignable to type 'number'.
let b: number = 5 // Everything ok. 

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

چگونه از TypeScript در مرورگر استفاده کنیم؟

برای اجرای TypeScript در مرورگر، باید با کامپایلر TypeScript (tsc) به جاوا اسکریپت منتقل شود. در این حالت، tsc یک فایل .js جدید بر اساس کد ts ایجاد می کند که می توانید از هر راهی که می توانید از یک فایل جاوا اسکریپت استفاده کنید، استفاده کنید.

نتیجه

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