Declaration merging คืออะไร?

Question

Accepted Answer

**Declaration merging** คือการที่ TypeScript รวมหลายประกาศที่มี**ชื่อเดียวกัน**เข้าเป็นนิยามเดียว Interfaces, namespaces และการสร้างอื่นๆ บางรูปแบบจะรวมอัตโนมัติ

## Interface merging

```ts
interface Box { width: number; }
interface Box { height: number; }
// Box is now { width: number; height: number } — both merged
```

## กรณีการใช้งานหลัก: เพิ่มประเภท third-party / global

นี่คือวิธีที่คุณเพิ่มประเภทให้กับไลบรารีหรือ globals ที่คุณไม่ได้เป็นเจ้าของ:

```ts
// Add a custom property to Express's Request
declare global {
  namespace Express {
    interface Request { user?: { id: string }; } // merges into Express.Request
  }
}
request.user; // ✅ now typed everywhere

// Augment a module
declare module "some-lib" {
  interface Options { newOption: boolean; }
}
```

เนื่องจาก `Request`/`Options` ของไลบรารีเป็น `interface` การประกาศของคุณจึง*รวม*เข้าไปแทนที่จะขัดแย้ง — ซึ่งช่วยให้คุณสามารถขยายประเภทที่คุณไม่สามารถแก้ไขได้อย่างปลอดภัย

## Namespace + function merging

```ts
function greet() {}
namespace greet { export const version = "1.0"; }
greet.version; // "1.0" — namespace merged onto the function
```

## ทำไม `type` ถึงทำไม่ได้

```ts
type A = { x: number };
type A = { y: number }; // ❌ Error: duplicate identifier
```

Type aliases เป็นเอกลักษณ์เฉพาะ; เพียง interfaces (และ namespaces) เท่านั้นที่จะรวมกัน — เหตุผลหลักในการใช้ `interface` สำหรับรูปร่าง API สาธารณะที่ขยายได้

## ทำไมจึงสำคัญ

Declaration merging คือกลไกเบื้องหลัง**module augmentation** — ขยาย Express requests, เพิ่ม `window`, ปรับแต่งประเภทไลบรารี, ระบบธีม

เป็นความรู้ที่จำเป็นสำหรับการเขียนประเภทของแอปจริง โดยคุณต้องปรับประเภทที่คุณไม่สามารถควบคุมได้ โดยไม่ต้องแยกออกจากกัน

Interface merging

กรณีการใช้งานหลัก: เพิ่มประเภท third-party / global

Namespace + function merging

ทำไม type ถึงทำไม่ได้

ทำไมจึงสำคัญ

ทำไม `type` ถึงทำไม่ได้