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

ฟังก์ชันยืนยันและตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด

เขียนฟังก์ชันยืนยัน (asserts x is T) และตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด (x is T) เพื่อจำกัดค่าที่ไม่ทราบชนิดหรือค่าแบบยูเนียนอย่างปลอดภัย

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

บทนำ

เป้าหมาย: เปลี่ยนการตรวจสอบขณะทำงานให้เป็นการปรับชนิดให้ละเอียดขึ้นด้วยฟังก์ชันยืนยันชนิดและตัวตรวจชนิดที่ผู้ใช้กำหนด เพื่อสร้างส่วนเชื่อมต่อที่ปลอดภัย

ฟังก์ชันยืนยันชนิด

ฟังก์ชันยืนยันชนิด ทำให้ชนิดแคบลงสำหรับโค้ดถัดไปหากฟังก์ชันส่งคืนค่า มิฉะนั้นฟังก์ชันต้องโยนข้อผิดพลาด

function assertIsString(x: unknown): asserts x is string {
  if (typeof x !== "string") {
    throw new Error("Expected string");
  }
}

let v: unknown = Math.random() > 0.5 ? "ok" : 42;
assertIsString(v); // after this, v is string
console.log(v.toUpperCase());

ฟังก์ชันตัวตรวจชนิด

ตัวตรวจชนิด ส่งคืนค่า x is T ทำให้การทำชนิดให้แคบลงในแขนงและฟังก์ชันช่วยทำได้อย่างชาญฉลาด

type Circle = { kind: "circle"; radius: number };
type Square = { kind: "square"; size: number };

type Shape = Circle | Square;

function isCircle(s: Shape): s is Circle {
  return s.kind === "circle";
}

function area(s: Shape): number {
  if (isCircle(s)) {
    return Math.PI * s.radius ** 2; // s is Circle here
  }
  return s.size * s.size; // s is Square here
}

console.log(area({ kind: "circle", radius: 2 }));

ตัวตรวจชนิดใน filter

ตัวตรวจชนิดสามารถทำหน้าที่เป็นเงื่อนไขตรวจสอบสำหรับเมธอดของอาร์เรย์ เช่น filter เพื่อปรับชนิดสมาชิกให้ละเอียดขึ้นได้อย่างเป็นระเบียบ

type Item = { id: number } | null | undefined;

function isPresent<T>(x: T | null | undefined): x is T {
  return x != null;
}

const items: Item[] = [{ id: 1 }, null, undefined, { id: 2 }];
const present = items.filter(isPresent);
// present has type { id: number }[]
console.log(present.map(i => i.id));

ยืนยันข้อมูลขณะทำงาน

รวมการแยกวิเคราะห์เข้ากับการยืนยันชนิดเพื่อหยุดทำงานทันทีเมื่อค่าไม่ใช่ชนิดที่คาดไว้

function parseJson(s: string): unknown {
  return JSON.parse(s);
}

try {
  const data = parseJson("{\"name\":\"Ada\"}");
  assertIsString(data); // will throw, because data is object
} catch (e) {
  console.log("Handled:", e instanceof Error ? e.message : e);
}

แนวทาง

แนวทาง:

  • การยืนยันชนิดต้องโยนข้อผิดพลาดเมื่อล้มเหลว
  • เลือกใช้ตัวตรวจชนิด (x is T) สำหรับตรรกะการแยกแขนง
  • ใช้การยืนยันชนิดที่ขอบเขตของส่วนเชื่อมต่อ เช่น อินพุต/เอาต์พุต ข้อมูลเจสัน และ DOM

ตรวจสอบฟังก์ชันยืนยันชนิด

ตรวจสอบอย่างรวดเร็ว: ฟังก์ชันยืนยันชนิดที่มี asserts x is string รับประกันอะไร

สรุปทบทวน

สรุปทบทวน: ใช้ฟังก์ชันยืนยันชนิดเพื่อบังคับใช้ชนิดหลังการตรวจสอบ และใช้ตัวตรวจชนิดที่ผู้ใช้กำหนดเพื่อทำให้แขนงและชุดข้อมูลแคบลง

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

บทเรียน “ฟังก์ชันยืนยันและตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “ฟังก์ชันยืนยันและตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด”

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

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

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

บทเรียน “ฟังก์ชันยืนยันและตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด” ใช้เวลานานแค่ไหน

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

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

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

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

  1. โอเวอร์โหลดฟังก์ชันและลายเซ็นการเรียกใช้
  2. การกำหนดชนิดข้อมูลพารามิเตอร์ this; void และ never
  3. ฟังก์ชันยืนยันและตัวตรวจชนิดข้อมูลที่ผู้ใช้กำหนด
← กลับไปที่ TypeScript Academy