TypeScript interfaces and types

---

Interfaces และ Types เป็นเครื่องมือใน TypeScript ที่ช่วยให้เราสามารถกำหนดโครงสร้างและรูปแบบของข้อมูลได้ ซึ่งช่วยให้โค้ดมีความชัดเจน เข้าใจง่าย และลดข้อผิดพลาดที่อาจเกิดขึ้น

Interfaces

ใช้สำหรับการกำหนดโครงสร้างของออบเจ็กต์ โดยระบุชื่อ property และชนิดข้อมูลที่ออบเจ็กต์ควรมี Interface เป็นเหมือนพิมพ์เขียวที่บอกว่าออบเจ็กต์ควรมีหน้าตาอย่างไร

ตัวอย่างการประกาศ Interface สำหรับออบเจ็กต์ Person:

interface Person {
  name: string;
  age: number;
  email?: string;
}

ในตัวอย่างนี้ Interface Person กำหนดว่าออบเจ็กต์ Person ควรมี property name เป็น string, age เป็น number และ email เป็น string และเป็น optional (กำหนดด้วยเครื่องหมาย ?)

เมื่อประกาศตัวแปรหรือฟังก์ชันที่ใช้ออบเจ็กต์ Person TypeScript จะตรวจสอบให้แน่ใจว่าออบเจ็กต์นั้นมีโครงสร้างตรงตามที่กำหนดไว้ใน Interface

function greetPerson(person: Person) {
  console.log(`Hello, ${person.name}!`);
}

const john = { name: 'John', age: 30 };
greetPerson(john); // output: Hello, John!

Types

Type aliases ใน TypeScript ใช้สำหรับการกำหนดชื่อให้กับชนิดข้อมูลที่ซับซ้อนหรือชนิดข้อมูลที่ใช้บ่อยๆ เพื่อให้โค้ดอ่านง่ายและเข้าใจได้มากขึ้น Type aliases สามารถใช้แทนชนิดข้อมูลใดๆ ก็ได้ เช่น primitive types, union types, intersection types หรือแม้แต่ออบเจ็กต์

ตัวอย่างการประกาศ Type alias สำหรับชนิดข้อมูลที่ซับซ้อน:

type Point = {
  x: number;
  y: number;
};

function calculateDistance(p1: Point, p2: Point): number {
  // ...
}

ในตัวอย่างนี้ เราประกาศ Type alias ชื่อ Point ซึ่งแทนออบเจ็กต์ที่มี property x และ y เป็น number เราสามารถใช้ Point เป็นชนิดข้อมูลสำหรับพารามิเตอร์ p1 และ p2 ในฟังก์ชัน calculateDistance ได้

Type aliases ยังสามารถใช้ในการสร้าง union types และ intersection types ได้อีกด้วย

type Status = 'active' | 'inactive';
type UserRoles = 'admin' & 'user';

เมื่อใดควรใช้ Interface และเมื่อใดควรใช้ Type?

• ใช้ Interface เมื่อต้องการกำหนดโครงสร้างของออบเจ็กต์ โดยเฉพาะอย่างยิ่งเมื่อต้องการใช้ features เฉพาะของ Interface เช่น declaration merging หรือ extension

• ใช้ Type เมื่อต้องการกำหนดชื่อให้กับชนิดข้อมูลที่ซับซ้อน, union types, หรือ intersection types หรือเมื่อต้องการกำหนดชื่อให้กับชนิดข้อมูลใดๆ ที่ไม่ใช่ออบเจ็กต์

• หากไม่มีความจำเป็นที่ต้องใช้ features เฉพาะของ Interface หรือ Type การเลือกใช้ Interface หรือ Type ก็ขึ้นอยู่กับความชอบส่วนบุคคลหรือ coding convention ของทีม

โดยสรุป ทั้ง Interfaces และ Types ช่วยให้เราสามารถกำหนดและบังคับใช้โครงสร้างของข้อมูลใน TypeScript ได้อย่างมีประสิทธิภาพ ซึ่งนำไปสู่โค้ดที่อ่านง่าย เข้าใจได้ และลดข้อผิดพลาดที่อาจเกิดขึ้น การเลือกใช้ Interface หรือ Type ขึ้นอยู่กับความต้องการและความซับซ้อนของโครงสร้างข้อมูลในแต่ละกรณี