วิธีการใช้ Omit บน TypeScript เพื่อดึงพร็อพเพอร์ตี้ที่ไม่ปรากฎชื่อตามที่กำหนด
Nuttavut Thongjor
TypeScript

เรียนรู้วิธีการใช้ Omit บน TypeScript เพื่อดึงพร็อพเพอร์ตี้ที่ไม่ปรากฎชื่อตามที่กำหนด

คำอธิบาย
ความคิดเห็น

กำหนดให้เรามีชนิดข้อมูลบน TypeScript คือ ButtonProps ดังนี้

TypeScript
1interface ButtonProps {
2 label: string;
3 color: string;
4 onClick: () => void;
5 onTap: () => void;
6}

เราต้องการสร้างชนิดข้อมูลใหม่ที่มาจากชนิดข้อมูลเดิมเพิ่มเติมคือไม่สนใจบางฟิลด์ที่มีชื่อขึ้นต้นด้วย on ดังนั้นผลลัพธ์สุดท้ายที่ต้องการจึงเป็นดังนี้

TypeScript
1interface ButtonPropsWithoutHandlers {
2 label: string;
3 color: string;
4}

เราสามารถใช้ Omit ซึ่งเป็น Utility Types ของ TypeScript ผสมกับ Template Literal Types เพื่อบอกว่าไม่สนใจฟิลด์ใด ๆ ที่ขึ้นต้นด้วย on ได้โดยใช้ on${string} ดังนี้

TypeScript
1type ButtonPropsWithoutHandlers = Omit<ButtonProps, `on${string}`>;

ผลลัพธ์สุดท้ายจะได้ ButtonPropsWithoutHandlers ที่มีฟิลด์ประกอบด้วย label และ color เท่านั้น