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

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

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

چرا TypeScript 

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

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

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

TypeScript چگونه کار میکند؟

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

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

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

یک مثال ساده از TypeScript

در این مقاله قصد نداریم که به شما TypeScript را آموزش دهیم. با این حال بیان یک مثال ساده می تواند در درک و آشنایی شما با این زبان تاثیرگذار باشد. در این مثال ساده به نحوه کار با جی کوئری خواهیم پرداخت.

دو روش برای دستیابی به ابزارهای TypeScript وجود دارد. یکی به وسیله npm و دیگری با استفاده از ویژوال استادیو. اگر شما از ویژوال استودیو نسخه ۲۰۱۷ و یا ۲۰۱۵ استفاده می کنید، کار شما بسیار ساده است. وقتی فایلی را با پسوند .ts در پروژه خود ذخیره می کنید، ویژوال استودیو به طور خودکار فایل های خروجی جاوا اسکریپت را برای شما تولید می کند.

بعد از نصب ابزارهای مناسب باید تعاریف نوع را نیز به منظور استفاده از انواع جی کوئری در TypeScript نصب کنید. اگر از ویژوال استودیو استفاده می کنید می توانید با استفاده از NuGet Package Manager به شکل زیر این کار را انجام دهید :

PM > Install-Package jquery.TypeScript.DefinitelyTyped

اکنون برای ایجاد فایلی با نام typescriptDemo.ts و نوشتن کدهای زیر در آن آماده شده اید :

کدهایی که در بالا با زبان تایپ اسکریپت نوشته شده است فرض می‌کنند که فایل html ایی به شکل زیر در پروژه وجود دارد :

لطفاً به بالای فایل html توجه کنید. ما فایل اسکریپت را با نام typescriptDemo.js به صفحه اضافه کرده ایم(نه فایل typescriptDemo.ts). همانطور که گفتم بعد از ذخیره سازی فایلی با پسوند .ts ویژوال استودیو به طور خودکار برای شما فایل typescriptDemo.js را تولید خواهد کرد. در این فایل کد های ساده جاوا اسکریپت نوشته شده است و می تواند توسط هر مرورگری اجرا شود.

با نگاهی مختصر به محتوای typescriptDemo.ts خواهید دید که به راحتی از قابلیت‌های شی گرایی در فایل خود استفاده کرده ایم. برای مثال ما کلاسی به نام Movie داریم که دارای فیلدی با نام name_ است. همچنین متدی به نام ()Play داریم که با کلیک بر روی دکمه اجرا خواهد شد. مثال بالا بسیار ساده بود. با این حال فریمورک هایی همچون آنگولار از کدهای تایپ اسکریپت پیچیده‌تری برای پیاده سازی منطق برنامه استفاده می کنند.

نتیجه 

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

#تایپ اسکریپت

منبع لرن سورس