ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข
ดึงชนิดภายในออกมาด้วย infer ในส่วนคำสั่ง extends
ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน TypeScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คีย์เวิร์ดสำหรับการอนุมานคืออะไร
คีย์เวิร์ด infer ปรากฏอยู่ภายในชนิดข้อมูลแบบมีเงื่อนไข และช่วยให้ TypeScript จับตัวแปรชนิดข้อมูลจากตำแหน่งที่จับคู่ได้ เพื่อให้คุณนำตัวแปรนั้นไปใช้ในกิ่งเงื่อนไขจริงได้
type GetReturn<T> = T extends (...args: any[]) => infer R ? R : never;ตัวอย่างการอนุมานพื้นฐาน
ในตัวอย่างนี้ เราแยกชนิดข้อมูลผลลัพธ์ของฟังก์ชันใด ๆ โดยใช้ infer R
type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;
type A = ReturnType<() => string>; // string
type B = ReturnType<() => number[]>; // number[]การทำงานของการอนุมาน
TypeScript จับคู่โครงสร้างของ T กับรูปแบบที่กำหนด หากจับคู่ได้ ตัวแปรที่อนุมานจะเก็บส่วนที่จับคู่ได้ หากจับคู่ไม่ได้ ระบบจะใช้กิ่งเงื่อนไขเท็จ
type First<T> = T extends [infer F, ...any[]] ? F : never;
type X = First<[string, number, boolean]>; // stringการอนุมานจากพารามิเตอร์แบบ泛型
คุณสามารถอนุมานอาร์กิวเมนต์ชนิดข้อมูลของชนิดข้อมูลแบบ泛型ได้ เช่น การแยก T จาก Promise
type Unwrap<T> = T extends Promise<infer U> ? U : T;
type A = Unwrap<Promise<string>>; // string
type B = Unwrap<number>; // numberตัวแปรการอนุมานหลายตัว
คุณสามารถใช้ส่วนคำสั่ง infer หลายส่วนในชนิดข้อมูลแบบมีเงื่อนไขเดียวกัน เพื่อจับหลายตำแหน่งได้พร้อมกัน
type Head<T> = T extends [infer H, ...infer Tail] ? H : never;
type Tail<T> = T extends [infer H, ...infer Tail] ? Tail : never;การอนุมานในพารามิเตอร์ฟังก์ชัน
การอนุมานสามารถจับชนิดข้อมูลของพารามิเตอร์ฟังก์ชันได้เช่นกัน ไม่ได้จำกัดเฉพาะชนิดข้อมูลผลลัพธ์
type FirstParam<T> = T extends (first: infer P, ...rest: any[]) => any ? P : never;
type A = FirstParam<(x: string, y: number) => void>; // stringพฤติกรรมแบบแจกแจงด้วยการอนุมาน
เมื่อ T เป็นยูเนียน ชนิดข้อมูลแบบมีเงื่อนไข รวมถึงชนิดข้อมูลที่มี infer จะแจกแจงไปยังสมาชิกแต่ละตัวของยูเนียน
type UnwrapAll<T> = T extends Promise<infer U> ? U : T;
type X = UnwrapAll<Promise<string> | Promise<number>>;
// string | numberการอนุมานซ้อนกัน
คุณสามารถซ้อนการอนุมานเพื่อเข้าถึงส่วนที่อยู่ลึกลงไปในโครงสร้างชนิดข้อมูล เช่น การแยกชนิดข้อมูลค่าของอาร์เรย์ที่อยู่ภายในพรอมิส
type UnwrapPromiseArray<T> =
T extends Promise<infer U>
? U extends (infer V)[]
? V
: U
: T;การอนุมานด้วยรูปแบบสตริง
ชนิดข้อมูลลิเทอรัลแม่แบบที่ใช้ร่วมกับการอนุมาน ช่วยให้คุณแยกสตริงย่อยจากชนิดข้อมูลลิเทอรัลสตริงได้
type GetDomain<T extends string> =
T extends `https://${infer Domain}` ? Domain : never;
type D = GetDomain<"https://example.com">; // "example.com"ข้อผิดพลาดที่พบบ่อย
การอนุมานทำงานได้เฉพาะภายในส่วนคำสั่ง extends ของชนิดข้อมูลแบบมีเงื่อนไข การใช้ที่อื่นจะทำให้เกิดข้อผิดพลาดขณะคอมไพล์ นอกจากนี้ การอนุมานในกิ่งเงื่อนไขเท็จจะไม่พร้อมใช้งาน
// Error: infer can only appear in extends clauses
type Bad<T> = infer R; // SyntaxErrorสรุป: การอนุมาน
คีย์เวิร์ด infer ช่วยให้ TypeScript จับส่วนของชนิดข้อมูลจากการจับคู่เชิงโครงสร้างในชนิดข้อมูลแบบมีเงื่อนไข สิ่งนี้เป็นกลไกเบื้องหลังชนิดข้อมูลอรรถประโยชน์อย่าง ReturnType, Parameters และ Awaited
ตรวจสอบอย่างรวดเร็ว
สามารถใช้คีย์เวิร์ด infer ได้ที่ใด
สิ่งที่คุณได้เรียนรู้
คีย์เวิร์ด infer ช่วยให้จับคู่รูปแบบในระดับชนิดข้อมูลได้ โดยแยกส่วนของชนิดข้อมูลจากรูปแบบเชิงโครงสร้าง สิ่งนี้เป็นรากฐานของชนิดข้อมูลอรรถประโยชน์อันทรงพลังและเมตาโปรแกรมมิงที่ปลอดภัยด้านชนิดข้อมูลใน TypeScript
คำถามที่พบบ่อย
บทเรียน “ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข”
ดึงชนิดภายในออกมาด้วย infer ในส่วนคำสั่ง extends คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน
บทเรียน “ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม
ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- ทำความเข้าใจ infer ในชนิดแบบมีเงื่อนไข
- สร้าง ReturnType และ Parameters ตั้งแต่ต้น
- รูปแบบการอนุมานชนิดที่ซ้อนกันลึก
- กรณีใช้งาน infer ในทางปฏิบัติ: การคลายห่อ Promise