JavaScript و TypeScript؛ تفاوت را کِی حس می‌کنیم؟

JavaScript همچنان همان زبانی است که منطق برنامه را با آن می‌نویسید. TypeScript روی همین پایه می‌آید و به داده‌ها و توابع توضیح بیشتری اضافه می‌کند؛ توضیحی که هم برای شما مفید است، هم برای ابزارهایی مثل VS Code.

مثلاً می‌توانید بگویید این متغیر باید عدد باشد، این تابع فقط رشته بگیرد یا این Object حتماً فیلدهای مشخصی داشته باشد.

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

پیدا کردن زودتر خطا

بعضی خطاهایی که در JavaScript تازه موقع اجرا می‌بینید، اینجا همان زمان نوشتن کد جلوی چشمتان می‌آیند.

خوانایی بهتر

از روی Typeها سریع‌تر می‌شود فهمید هر تابع یا Component چه داده‌ای می‌خواهد و چه چیزی تحویل می‌دهد.

Refactor مطمئن‌تر

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

مناسب کار تیمی

Typeها شبیه یک قرارداد مشترک‌اند؛ توسعه‌دهنده بعدی لازم نیست برای فهمیدن شکل داده، چند فایل را حدس بزند.

React و Next.js

در React و Next.js می‌توانید شکل Props، State و پاسخ API را واضح تعریف کنید و کمتر دنبال این بگردید که «این مقدار از کجا آمده بود؟».

پروژه‌های تیمی

در کار تیمی، Typeها بخش زیادی از ابهام را کم می‌کنند و به بقیه می‌گویند هر قسمت از کد دقیقاً چه داده‌ای انتظار دارد.

پنل و داشبورد

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

پروژه‌های بلندمدت

پروژه‌ای که قرار است ماه‌ها یا سال‌ها زنده بماند، بیشتر از یک نمونه موقت به خوانایی و تغییر امن نیاز دارد.

JavaScript را خوب یاد بگیرید

اول مطمئن شوید Function، Array، Object، Module و جریان اصلی JavaScript برایتان جا افتاده است.

Typeهای پایه

از Typeهای ساده شروع کنید و برای ورودی و خروجی تابع‌ها Type بنویسید؛ همین بخش خیلی از مفهوم را جا می‌اندازد.

Interface و Type Alias

بعد سراغ داده‌های واقعی پروژه بروید و شکل Objectها را با Interface یا Type Alias تعریف کنید.

Union، Narrowing و Generic

وقتی پایه‌ها راحت شد، Union، Narrowing و Generic را روی مثال‌های واقعی تمرین کنید؛ نه فقط تعریف‌ها.

پروژه واقعی

در یک پروژه React یا Next.js، Typeها را برای Props، فرم‌ها و پاسخ API وارد کنید تا کاربردشان را واقعاً ببینید.

TypeScript را با یک پروژه یاد بگیرید، نه با حفظ کردن Typeها

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

مثلاً برای Product یک Type بسازید، پاسخ API را با همان ساختار بگیرید و بعد آن را به Props کارت محصول بدهید. اینجا خیلی روشن می‌بینید Type چه مشکلی را حل کرده است.

از روز اول سراغ Typeهای عجیب و چندلایه نروید. اگر تعریف Type از خود کد سخت‌تر خوانده می‌شود، احتمالاً دارید مسئله را پیچیده‌تر از چیزی که هست حل می‌کنید.

any گاهی لازم می‌شود، اما اگر پاسخ هر مشکل شما any باشد، عملاً بخش مهمی از فایده TypeScript را خاموش کرده‌اید.

Type قرار است فهم کد را راحت‌تر کند؛ نه اینکه برای خواندن خودش به توضیح جداگانه نیاز داشته باشد.

اگر JavaScript را خوب نفهمیده باشید، TypeScript آن ضعف را پنهان نمی‌کند؛ فقط یک لایه جدید به همان مشکل اضافه می‌شود.

Syntax بدون پروژه خیلی زود فراموش می‌شود. بهتر است هر مفهوم را همان موقع در یک مسئله واقعی استفاده کنید.