0Pricing
TypeScript Academy · บทเรียน

การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป

เปลี่ยนชื่อคีย์ระหว่างการแปลงชนิด

การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน TypeScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน

ยินดีต้อนรับ

TypeScript 4.1 เพิ่มอนุประโยค `as` ในประเภทแมป ทำให้สามารถแมปคีย์ใหม่ (เปลี่ยนชื่อ) เป็นส่วนหนึ่งของการแปลงประเภทได้

การเปลี่ยนชื่อคีย์พื้นฐาน

เพิ่ม `as NewKeyType` หลังตัวแปรคีย์เพื่อเปลี่ยนชื่อเป็นคีย์ใหม่
type Prefixed<T> = {
  [K in keyof T as `prefix_${string & K}`]: T[K]
};
type P = Prefixed<{ name: string }>;
// { prefix_name: string }

การกรองคีย์ด้วย never

ส่งคืน never จากส่วนคำสั่ง `as` เพื่อลบคีย์นั้นออกจากประเภทผลลัพธ์
type OnlyStrings<T> = {
  [K in keyof T as T[K] extends string ? K : never]: T[K]
};

การสร้างชื่อเมธอดอ่านค่า

ใช้ Capitalize ร่วมกับประเภทเทมเพลตลิเทอรัลเพื่อสร้างชื่อเมธอดอ่านค่า
type Getters<T> = {
  [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K]
};
type UserGetters = Getters<{ name: string; age: number }>;
// { getName: () => string; getAge: () => number }

การสร้างชื่อเมธอดกำหนดค่า

สร้างชื่อเมธอดกำหนดค่าสำหรับคุณสมบัติของประเภทในลักษณะเดียวกัน
type Setters<T> = {
  [K in keyof T as `set${Capitalize<string & K>}`]: (val: T[K]) => void
};

การกลับด้านประเภท Record

สลับคีย์กับค่าโดยใช้การเปลี่ยนชื่อคีย์
type Invert<T extends Record<string, string>> = {
  [K in keyof T as T[K]]: K
};

การเปลี่ยนชื่อคีย์แบบมีเงื่อนไข

ใช้การแปลงคีย์ที่แตกต่างกันตามประเภทของค่า
type MethodKeys<T> = {
  [K in keyof T as T[K] extends Function ? K : never]: T[K]
};

การรวมกับเทมเพลตลิเทอรัล

ใช้ประเภทเทมเพลตลิเทอรัลในการเปลี่ยนชื่อเพื่อสร้างคีย์ที่มีเนมสเปซ
type Namespaced<T, NS extends string> = {
  [K in keyof T as `${NS}::${string & K}`]: T[K]
};

การแมปคีย์สัญลักษณ์

การเปลี่ยนชื่อคีย์ยังช่วยให้คุณทำงานกับคีย์สัญลักษณ์ได้ด้วย

ภาคปฏิบัติ: ประเภท FormData

สร้างออบเจ็กต์แบบฟอร์มที่มีค่าเป็นสตริงจากโมเดลข้อมูลที่มีการกำหนดประเภท
type FormFields<T> = {
  [K in keyof T as K extends string ? K : never]: string
};

การรวม as กับประเภทแบบมีเงื่อนไข

การเปลี่ยนชื่อคีย์และประเภทแบบมีเงื่อนไขสามารถประกอบกันเพื่อสร้างการแปลงประเภทที่สื่อความหมายได้อย่างมาก

ตรวจสอบอย่างรวดเร็ว

การส่งคืน `never` จากส่วนคำสั่ง `as` ในประเภทแบบแมปส่งผลอย่างไรต่อคีย์นั้น

สรุปทบทวน

ส่วนคำสั่ง `as` ในประเภทแบบแมปช่วยให้คุณเปลี่ยนชื่อ กรองด้วย never และแปลงคีย์โดยใช้เทมเพลตลิเทอรัลกับเงื่อนไขได้ ทำให้ใช้รูปแบบที่ทรงพลังได้ เช่น การสร้างเมธอดอ่านค่า/กำหนดค่า และการกรองคุณสมบัติตามประเภทของค่า

คำถามที่พบบ่อย

บทเรียน “การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป”

เปลี่ยนชื่อคีย์ระหว่างการแปลงชนิด คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน

บทเรียน “การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม

ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. ชนิดแมป: การแปลงชนิดออบเจ็กต์
  2. ตัวปรับแต่งในชนิดแมป: readonly และ ?
  3. ชนิดลิเทอรัลแม่แบบ: รูปแบบข้อความ
  4. การเปลี่ยนชื่อคีย์ด้วย as ในชนิดแมป
← กลับไปที่ TypeScript Academy