الـ TypeScript

الهدف

بنهاية الدرس تحوّل ملف JavaScript لـ TypeScript، تضيف types لكل parameter و return value، وتقرأ generic types من مكتبات بدون ما تخاف منها.

ليش هذا الحين؟

ترى وايد ناس يقولون TypeScript "معقد في البداية" — بس بعد أول أسبوع يستحيل يرجعون لـ JavaScript. السبب: TypeScript يمسك الخطأ قبل ما يصير. بدل ما تكتشف في runtime إنك مررت undefined لـ function تتوقع string، الـ editor ينبهك فورا بخط أحمر. وللـ founders اللي يشتغلون بروحهم، هذا يوفّر ساعات debugging.

الفكرة

TypeScript = JavaScript + types.

كل كود JavaScript صالح في TypeScript. تضيف types تدريجيا — ما لازم تحوّل كل شي دفعة واحدة.

5 Features تغطي 90% من اللي تحتاجه:

1. Basic Types:

const name: string = 'محمد'
const age: number = 25
const isActive: boolean = true
const tags: string[] = ['founder', 'builder']

2. Interfaces — شكل الـ object:

interface User {
  id: string
  name: string
  email: string
  createdAt: Date
}

3. Type Aliases — اسم لنوع:

type Status = 'active' | 'inactive' | 'pending'  // union type
type UserId = string  // alias بسيط

4. Optional Fields:

interface Post {
  id: string
  title: string
  body?: string  // ← هذا optional — يمكن يكون undefined
}

5. Generics — قالب مرن:

// هذي الـ function تشتغل مع أي نوع
function first<T>(arr: T[]): T | undefined {
  return arr[0]
}

const num = first([1, 2, 3])   // TypeScript يعرف num هو number
const str = first(['a', 'b'])  // TypeScript يعرف str هو string

القاعدة الذهبية: لو TypeScript يشتكي، هو غالبا صح. ما تستخدم as any أو // @ts-ignore إلا كـ last resort. بدل جذي، افهم ليش يشتكي وأصلح المشكلة الحقيقية.