บทนำสู่ชนิดแบบแมป

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

ชนิดแบบแมปมีประสิทธิภาพสำหรับสร้างโครงสร้างชนิดที่ยืดหยุ่นและนำกลับมาใช้ซ้ำได้ใน TypeScript

ชนิดแบบแมปคืออะไร

ชนิดแบบแมปใช้ไวยากรณ์เช่น { [P in keyof T]: T[P] } เพื่อวนซ้ำผ่านคุณสมบัติของชนิด T

ตัวอย่างพื้นฐานของชนิดแบบแมป

ตัวอย่างง่าย ๆ ต่อไปนี้แสดงวิธีใช้ชนิดแบบแมปเพื่อสร้างชนิดเวอร์ชันอ่านได้อย่างเดียว:

type User = {
  name: string;
  age: number;
};

type ReadonlyUser = {
  readonly [P in keyof User]: User[P];
};

การใช้ชนิดแบบแมปในตัว

TypeScript มีชนิดแบบแมปในตัวหลายชนิด เช่น:

• Readonly<T>: ทำให้คุณสมบัติทั้งหมดของ T เป็นแบบอ่านได้อย่างเดียว
• Partial<T>: ทำให้คุณสมบัติทั้งหมดของ T เป็นตัวเลือก
• Required<T>: ทำให้ต้องระบุคุณสมบัติทั้งหมดของ T

type User = {
  name: string;
  age: number;
};

// Example of Partial
const user: Partial<User> = {
  name: 'John',
};

การแมปชนิดยูเนียน

ชนิดแบบแมปยังใช้ร่วมกับชนิดยูเนียนเพื่อสร้างชนิดใหม่ที่รวมกันได้:

type Status = 'active' | 'inactive';

type StatusFlags = {
  [K in Status]: boolean;
};

const flags: StatusFlags = {
  active: true,
  inactive: false,
};

ชนิดแบบแมปมีเงื่อนไข

คุณสามารถใช้ชนิดแบบมีเงื่อนไขร่วมกับชนิดแบบแมปเพื่อสร้างการแปลงชนิดที่ซับซ้อนยิ่งขึ้น

type User = {
  name: string;
  age?: number;
};

type NonOptional<T> = {
  [K in keyof T]-?: T[K];
};

type RequiredUser = NonOptional<User>;

ตัวอย่างขั้นสูง: ไม่รวมคุณสมบัติ

ต่อไปนี้เป็นวิธีสร้างชนิดแบบแมปเพื่อไม่รวมคุณสมบัติบางรายการ:

type User = {
  id: number;
  name: string;
  password: string;
};

type PublicUser = {
  [K in keyof User as Exclude<K, 'password'>]: User[K];
};

แบบฝึกหัด

สร้างชนิดแบบแมปที่เพิ่มตัวปรับแก้ readonly ให้กับคุณสมบัติทั้งหมดของชนิด Product ทดสอบโดยประกาศตัวแปรที่มีชนิดใหม่

ขอแสดงความยินดี!

คุณได้เรียนรู้วิธีใช้ประเภทแบบแมปเพื่อแปลงประเภทที่มีอยู่ให้เป็นประเภทใหม่แบบไดนามิกแล้ว โปรดฝึกใช้เทคนิคเหล่านี้เพื่อทำให้โค้ด TypeScript ของคุณมีประสิทธิภาพยิ่งขึ้น!