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

แฟล็กความเคร่งครัด

เปิดใช้ความเคร่งครัดเพื่อโค้ดที่ปลอดภัยยิ่งขึ้น ได้แก่ strict, noImplicitAny, exactOptionalPropertyTypes และ noUncheckedIndexedAccess

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

บทนำ

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

  • strict
  • noImplicitAny
  • exactOptionalPropertyTypes
  • noUncheckedIndexedAccess

strict + noImplicitAny

strict เปิดใช้ชุดการตรวจสอบหลายรายการ ส่วน noImplicitAny ห้ามพารามิเตอร์หรือตัวแปรที่ไม่มีชนิดข้อมูลและถูกกำหนดเป็น any โดยปริยาย

// tsconfig.json (excerpt)
{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true
  }
}

// Effect demo
function sum(a, b) { // Error: implicit any
  return a + b;
}

function sumOk(a: number, b: number): number {
  return a + b;
}

exactOptionalPropertyTypes

exactOptionalPropertyTypes แยกความแตกต่างระหว่าง ไม่มีอยู่ กับ มีอยู่แต่เป็น undefined เหมาะอย่างยิ่งสำหรับการสร้างแบบจำลอง API

// exactOptionalPropertyTypes: true
interface User { name?: string }

const u1: User = {};          // ok: name is absent
const u2: User = { name: undefined }; // Error when exactOptionalPropertyTypes is true

function greet(u: User) {
  if ("name" in u) {
    // name exists but could be undefined without this flag
    console.log("Hi", u.name);
  }
}

การเข้าถึงตามดัชนี (แถวลำดับ)

การเข้าถึงแถวลำดับตามดัชนีจะให้ค่าเป็น T | undefined ตรวจสอบค่าก่อนนำไปใช้เพื่อป้องกันโปรแกรมขัดข้องขณะทำงาน

// noUncheckedIndexedAccess: true
const xs: number[] = [1,2,3];
const maybe = xs[5]; // type: number | undefined
if (maybe !== undefined) {
  console.log(maybe.toFixed(0));
}

การเข้าถึงตามดัชนี (แผนที่)

ผลลัพธ์จากการเข้าถึงออบเจ็กต์และ Record<K,V> ตามดัชนีจะรวม undefined ไว้ จนกว่าคุณจะยืนยันว่ามีค่านั้นอยู่

// Also affects records/maps
const byId: Record<string, { id: string }> = {};
const item = byId["x"]; // { id: string } | undefined
if (item) {
  console.log(item.id);
}

ค่าตั้งต้นแบบเข้มงวด

เริ่มต้นด้วย strict และผ่อนคลายเฉพาะเมื่อจำเป็น ตัวเลือกเหล่านี้ป้องกันข้อผิดพลาดที่พบบ่อยโดยเพิ่มสัญญาณรบกวนเพียงเล็กน้อยในโค้ดใหม่

// tsconfig.json (excerpt)
{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "exactOptionalPropertyTypes": true,
    "noUncheckedIndexedAccess": true
  }
}

การตรวจสอบการเข้าถึงตามดัชนี

ตรวจสอบอย่างรวดเร็ว: noUncheckedIndexedAccess เปลี่ยนแปลงอะไร

สรุปทบทวน

สรุปทบทวน: strict เปิดใช้ค่าเริ่มต้นที่ปลอดภัยยิ่งขึ้น noImplicitAny ค้นหาชนิดข้อมูลที่ขาดหาย exactOptionalPropertyTypes สร้างแบบจำลองฟิลด์ที่ไม่บังคับได้อย่างแม่นยำ และ noUncheckedIndexedAccess บังคับให้ตรวจสอบการมีอยู่ของค่า

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

บทเรียน “แฟล็กความเคร่งครัด” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “แฟล็กความเคร่งครัด”

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

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

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

บทเรียน “แฟล็กความเคร่งครัด” ใช้เวลานานแค่ไหน

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

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

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

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

  1. แฟล็กความเคร่งครัด
  2. การตั้งค่า Target, lib, module และ JSX
  3. การอ้างอิงโปรเจกต์ (เบื้องต้น)
← กลับไปที่ TypeScript Academy