TypeScript Academy · บทเรียน

การบังคับใช้ขั้นตอนที่จำเป็น

ป้องกันการเรียก build() จนกว่าจะกำหนดฟิลด์ที่จำเป็นครบถ้วน

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

ป้องกันการเรียก build() ก่อนกำหนด

ตอนนี้เราจะใช้สถานะที่สะสมเพื่อห้ามเรียก build() จนกว่าจะกำหนดฟิลด์ที่จำเป็นครบ ระบบชนิดข้อมูลจะเป็นผู้ป้องกันการสร้างอ็อบเจ็กต์ไม่ครบ ไม่ใช่การตรวจสอบขณะทำงาน

กำหนดโครงสร้างสุดท้าย

เริ่มด้วยการประกาศอ็อบเจ็กต์ทั้งหมดและระบุว่าคีย์ใดบังคับ ตัวสร้างจะอนุญาตให้เรียก build() ได้เฉพาะเมื่อสถานะมีคีย์เหล่านั้นครบ

interface Config {
  url: string;   // required
  method: string; // required
  timeout?: number; // optional
}
type Required = { url: string; method: string };

ลายเซ็นของ build แบบมีเงื่อนไข

เราจะทำให้ build ใช้งานได้เฉพาะเมื่อสถานะที่สะสม S ครอบคลุมคีย์ที่จำเป็น ชนิดข้อมูลแบบมีเงื่อนไขจะคืนเมธอดจริงหรือเมธอดที่ใช้งานไม่ได้

class Builder<S> {
  build(this: Builder<Required>): Config {
    return this.d as Config;
  }
  private d: Record<string, unknown> = {};
}

การใช้พารามิเตอร์ this

พารามิเตอร์ this: Builder<Required> จะจำกัดว่าตัวสร้างใดสามารถเรียก build ได้ หาก S ไม่ตรงตาม Required การเรียกนั้นจะเป็นข้อผิดพลาดของชนิดข้อมูล

// Only a Builder whose S includes url and method
// can legally invoke build().

เชื่อมเมธอดกำหนดค่ากับสถานะ

เมธอดกำหนดค่าแต่ละเมธอดจะขยาย S เหมือนเดิม หลังจากเมธอดกำหนดค่าที่จำเป็นทั้งสองทำงานแล้ว S จึงครอบคลุม Required ในที่สุด และสามารถเรียก build ได้

class Builder<S> {
  private d: Record<string, unknown> = {};
  url(u: string): Builder<S & { url: string }> { this.d.url = u; return this as any; }
  method(m: string): Builder<S & { method: string }> { this.d.method = m; return this as any; }
  build(this: Builder<{ url: string; method: string }>): Config { return this.d as Config; }
}

กรณีสำเร็จคอมไพล์ผ่าน

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

const cfg = new Builder<{}>().url("/x").method("GET").build();
console.log(cfg.url, cfg.method);

กรณีไม่สำเร็จจะไม่ผ่าน

หากข้ามขั้นตอนที่จำเป็นไป build() จะไม่ผ่านการตรวจสอบชนิดข้อมูลอีกต่อไป เพราะ S ของตัวสร้างไม่ครอบคลุม Required ข้อผิดพลาดนี้จึงถูกตรวจพบขณะคอมไพล์

// const bad = new Builder<{}>().url("/x").build();
// Error: 'build' can only be called when method is set too.

เหตุใดวิธีนี้จึงดีกว่าการตรวจสอบขณะทำงาน

การตรวจสอบขณะทำงานอย่าง if (!this.url) throw จะล้มเหลวก็ต่อเมื่อโค้ดทำงานแล้ว แต่วิธีใช้พารามิเตอร์ this จะล้มเหลวตั้งแต่การตรวจสอบชนิดข้อมูล ดังนั้นอ็อบเจ็กต์ที่สร้างไม่ครบจะไม่ถูกส่งมอบ

ฟิลด์ทางเลือกยังคงเป็นทางเลือก

ขั้นตอนทางเลือกอย่าง timeout ไม่เคยเป็นส่วนหนึ่งของ Required จึงไม่เป็นเงื่อนไขบังคับของ build() คุณจะใส่หรือข้ามขั้นตอนเหล่านี้ก็ได้อย่างอิสระ

const ok = new Builder<{}>().method("PUT").url("/y").build();
console.log("order of required steps does not matter");

รองรับข้อกำหนดจำนวนมาก

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

ข้อจำกัด

การรับประกันนี้ขึ้นอยู่กับการส่งต่อ S อย่างถูกต้องผ่านเมธอดกำหนดค่าทุกเมธอด และการใช้การกำหนดชนิดข้อมูลด้วยพารามิเตอร์ this ควรจำกัดการแปลงชนิดไว้ภายในเมธอดกำหนดค่า เพื่อให้ผู้เรียกยังปลอดภัยด้านชนิดข้อมูลอย่างสมบูรณ์

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

ตรวจสอบความเข้าใจบทเรียนนี้อย่างรวดเร็ว

ทบทวน

หากต้องการบังคับใช้ขั้นตอนที่จำเป็น ให้กำหนดชนิดของ build ด้วยพารามิเตอร์ this: Builder<Required> เมธอดนี้จะผ่านการตรวจสอบชนิดข้อมูลก็ต่อเมื่อสถานะสะสม S มีคีย์ที่จำเป็นครบทุกตัว ทำให้การสร้างอ็อบเจ็กต์ไม่ครบกลายเป็นข้อผิดพลาดขณะคอมไพล์

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

บทเรียน “การบังคับใช้ขั้นตอนที่จำเป็น” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “การบังคับใช้ขั้นตอนที่จำเป็น”

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

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

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

บทเรียน “การบังคับใช้ขั้นตอนที่จำเป็น” ใช้เวลานานแค่ไหน

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

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

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

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

← กลับไปที่ TypeScript Academy