🟦 TypeScript (สอนแบบครบระดับ)

TypeScript คือ JavaScript ที่มีระบบ type ช่วยลดบั๊ก เพิ่มความมั่นใจในการ refactor และเหมาะกับโปรเจกต์ทีม/โปรเจกต์ใหญ่

🧠 ทำไมต้องใช้ TypeScript

  • ✅ จับบั๊กตั้งแต่ตอนเขียนโค้ด (ก่อนรัน)
  • ✅ IDE ช่วย auto-complete และ refactor ได้แม่น
  • ✅ เหมาะกับโปรเจกต์ใหญ่และการทำงานเป็นทีม

🔤 Types พื้นฐาน

let name: string = 'Somchai';
let age: number = 20;
let isStudent: boolean = true;

let tags: string[] = ['ts', 'types'];
let scores: Array<number> = [10, 20, 30];
// union type
let id: string | number = 'u_1';
id = 123;

// literal type
let status: 'draft' | 'published' = 'draft';

🧩 Function Types

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

const formatName = (firstName: string, lastName: string): string => {
  return firstName + ' ' + lastName;
};
// optional + default
function greet(name?: string) {
  return 'Hi ' + (name ?? 'Guest');
}

function calcVat(price: number, vatRate: number = 0.07) {
  return price * vatRate;
}

🎮 ตัวอย่าง (จำลองผลลัพธ์)

🏁 สรุป

  • ✅ TypeScript เพิ่มความปลอดภัยด้วย type
  • ✅ เริ่มจาก types พื้นฐาน + union/literal
  • ✅ ใส่ type ให้ function ช่วยให้โค้ดอ่านง่ายและลดบั๊ก

📝 แบบฝึกหัด

  1. ประกาศตัวแปร name/age/isStudent พร้อม type
  2. สร้าง union type สำหรับ userId (string หรือ number)
  3. เขียนฟังก์ชัน calcGrade(score) คืนค่าเป็น 'A' | 'B' | 'C' | 'F'