طبق بررسی توسعه دهندگان Stack Overflow در سال ۲۰۱۸، TypeScript به عنوان یک زبان برنامه نویسی، نسبت به JavaScript بیشتر دوست داشته شده است. علت این که TypeScript اینقدر میان توسعه دهندگان JavaScript محبوب است، این است که اضافه کردن typeها به JavaScript شما را قادر می‌سازد تا قبل از اجرای کد خود، خطاهای آن را بیابید. خطاهای فراهم شده توسط کمپایلر JavaScript، نحوه برطرف شدن یک خطا را به خوبی نشان خواهند داد. اضافه کردن typeها به JavaScript همچنین ویرایشگرهای کد را قادر می‌سازد تا برخی امکانات پیشرفته‌تر، مانند تکمیل کد، بازسازی در حد پروژه و وارد کردن خودکار ماژول را فراهم کنند.
در بخش اول این مقاله با ما همراه باشید...
تصویر بالا، نتایج سوال «دوست داشته شده‌ترین زبان برنامه نویسی» از بررسی توسعه دهندگان Stack Overflow می‌باشد.
اگر درباره TypeScript به عنوان یک زبان کاملا جدید فکر کنید، یادگیری آن می‌تواند برای شما دلهره‌آور باشد. گرچه، TypeScript فقط یک لایه اضافه شده به JavaScript است و شما قبل از شروع به استفاده از آن، به هیچ وجه نیاز ندارید که تمام سینتکس‌های به همراه آن را بلد باشید. TypeScript شما را قادر می‌سازد تا یک فایل JavaScript را به آسانی با تغییر دادن پسوند آن از .js به .ts، تبدیل کنید و پس از انجام این کار، تمام کد موجود در آن به درستی به TypeScript تبدیل خواهد شد. اگر می‌خواهید درصد بالایی از پوشش typeها را در فایل‌های TypeScript خود اعمال کنید، می‌توانید TypeScript را به گونه‌ای پیکربندی کنید که محدود کننده‌تر باشد؛ اما این کار وقتی که با این زبان آشنا شوید، می‌تواند انجام شود.
این مقاله در هدف دارد تا ۹۵ درصد سناریوهایی که معمولا در یک پروژه استاندارد JavaScript با آن‌ها مواجه می‌شوید را برای شما برطرف کند. برای ۵ درصد دیگر هم Google دوست شماست و همچنین می‌توانید نگاهی به دوره آموزشی TypeScript بر روی راکت داشته باشید.
راه‌اندازی TypeScript
برای شروع به نوشتن کد TypeScript که به درستی کمپایل می‌شود، یک محیط توسعه‌دهی که به درستی پیکربندی شده باشد مورد نیاز است.
۱. کمپایلر TypeScript را نصب کنید
برای شروع کار، کمپایلر TypeScript باید نصب شده باشد، تا فایل‌های TypeScript را به فایل‌های JavaScript تبدیل کند. برای انجام این کار، TypeScript می‌تواند یا به صورت global (که در همه جای سیستم فایل شما در دسترس است) و یا به صورت محلی (که فقط در سطح پروژه در دسترس است) نصب شود.
دستورات مربوط به نصب TypeScript به صورت global یا محلی بر روی کامپیوتر خود، از طریق خط دستوری:
# متد نصلی ان‌پی‌ام
npm install --global typescript # Global installation
npm install --save-dev typescript # Local installation
# متد نصبی شما
yarn global add typescript # Global installation
yarn add --dev typescript # Local installation
۲. مطمئن شوید ویرایشگر شما به گونه‌ای راه‌اندازی شده است که از TypeScript پشتیبانی کند
شما می‌خواهید مطمئن شوید که ویرایشگر شما به درستی پیکربندی شده است، تا با TypeScript کار کند. برای مثال، شاید نیاز باشد که یک پلاگین (مانند atom-typescript در صورت استفاده از ویرایشگر Atom) را نصب کنید، تا به طور کامل از TypeScript در پروژه خود بهره ببرید. اگر از VS Code استفاده می‌کنید، پشتیبانی TypeScript به طور داخلی در آن وجود دارد؛ پس نیازی به هیچ‌گونه افزونه نیست.
۳. یک فایل به نام **tsconfig.json** بسازید
برای پیکربندی تنظیمات پروژه TypeScript، از یک فایل tsconfig.json استفاده می‌شود. فایل tsconfig.json باید در شاخه ریشه پروژه قرار بگیرد. این فایل شما را قادر می‌سازد تا کمپایلر TypeScript را با گزینه‌های متفاوت پیکربندی کنید.
اگر فقط می‌خواهید TypeScript را به کار بیندازید، باید فایل tsconfig.json را شامل یک آبجکت JSON خالی کنید، اما اگر نیاز دارید که کمپایلر TypeScript به طور متفاوتی رفتار کند (مثلا فایل‌های جاوااسکریپت transpile شده را در یک شاخه خروجی مشخص قرار دهد)، می‌توانید در این لینک درباره تنظیمات دیگر بخوانید.
۴. TypeScript را به جاوااسکریپت transpile کنید
برای این که کد TypeScript خود را به جاوااسکریپت transpile کنید، دستور tsc باید در ترمینال اجرا شود. اجرای دستور tsc به کمپایلر TypeScript خواهد گفت به دنبال فایل tsconfig.json بگردد، که شاخه ریشه پروژه را به همراه گزینه‌هایی برای استفاده در هنگام کمپایل کردن TypeScript و transpile کردن فایل‌های .ts به .js تعیین خواهد کرد.
برای آزمایش سریع این که آیا این راه‌اندازی‌ها کار می‌کنند یا نه، می‌توانید یک فایل آزمایش TypeScript بسازید و دستور tsc را در خط دستوری اجرا کنید تا ببینید که آیا در کنار فایل TypeScript، فایل JavaScript هم ساخته شده است، یا نه.
برای مثال، این فایل TypeScript:
const greeting = (person: string) => {
console.log('Good day ' + person);
};
greeting('Daniel');
باید به این فایل جاوااسکریپت transpile شده باشد:
var greeting = function(person) {
console.log('Good day ' + person);
};
greeting('Daniel');
اگر دوست دارید که کمپایلر TypeScript شما مراقب تغییرات موجود در فایل‌های TypeScript شما باشد و به طور خودکار روند transpile کردن فایل‌های .ts به .js را فعال کند، می‌توانید دستور tsc -p را در مخزن پروژه خود اجرا کنید.
در VS Code، شما می‌توانید از ⌘⇧B برای بالا آوردن یک منو استفاده کنید که می‌تواند transpiler را در حالت معمولی یا watch (به ترتیب tsc:build یا tsc:watch) اجرا کند.
درک typeهای استاتیک و دینامیک
JavaScript هفت type دینامیک را به همراه دارد:
- Undefined (تعریف نشده)
- Null (خالی)
- Boolean
- عدد (number)
- رشته (string)
- علائم
- آبجکت
typeهای بالا، دینامیک نام دارند؛ زیرا در حین رانش استفاده می‌شوند.
TypeScript، نوع‌های (typeهای) استاتیک را به زبان JavaScript می‌آورد، و این typeها در حین کمپایل کردن ارزیابی می‌شوند (بدون این که نیاز به اجرای کد باشد). Typeهای استاتیک چیزی هستند که مقدار typeهای دینامیک را پیش‌بینی می‌کنند، و این می‌تواند در هشدار دادن به شما درباره خطاهای احتمالی کمک کند، بدون این که نیاز باشد کد را اجرا کنید.
در بخش دوم این مقاله که به زودی بر روی راکت قرار خواهد گرفت، با ما همراه باشید...
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید