PricingLoginStart free
TypeScript Academy · บทเรียน

Enum เทียบกับ const enum และทางเลือกแบบยูเนียนลิเทอรัล

เปรียบเทียบ enum แบบดั้งเดิม const enum และทางเลือกแบบยูเนียนลิเทอรัล พร้อมเรียนรู้ข้อแลกเปลี่ยนด้าน DX ขนาด และความปลอดภัย

บทเรียน 3 จาก 38 ขั้นตอน

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

บทนำ

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

เอนัมตัวเลข

เอนัมตัวเลข สร้างออบเจ็กต์ขณะทำงานและรองรับการแมปย้อนกลับ ใช้งานง่าย แต่เพิ่มขนาดชุดโปรแกรมเล็กน้อย

enum Direction {
  Left = 0,
  Right = 1
}

const d: Direction = Direction.Left;
console.log(d); // 0

เอนัมสตริง

เอนัมสตริง อ่านง่ายในบันทึกและส่วนติดต่อโปรแกรมประยุกต์ อีกทั้งยังสร้างออบเจ็กต์ขณะทำงานด้วย

enum Status {
  Ok = "ok",
  Error = "error"
}

const s: Status = Status.Ok;
console.log(s); // "ok"

เอนัมคงที่

เอนัมคงที่ จะแทรกค่าไว้ในโค้ดขณะคอมไพล์ ทำให้ไม่มีต้นทุนขณะทำงาน แต่ต้องใช้เครื่องมือสร้างที่ทำงานสอดคล้องกัน

const enum Axis {
  X = 0,
  Y = 1
}

const a: Axis = Axis.X;
console.log(a); // 0 (inlined)

ทางเลือกยูเนียนลิเทอรัล

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

type Dir = "left" | "right";

function move(d: Dir) {
  switch (d) {
    case "left":
      console.log("←");
      break;
    case "right":
      console.log("→");
      break;
  }
}

move("left");

ควรเลือกใช้เมื่อใด

แนวทาง:

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

ตรวจสอบยูเนียนลิเทอรัลกับเอนัม

ตรวจสอบอย่างรวดเร็ว: ข้อใดเป็น TRUE เกี่ยวกับชนิดข้อมูลยูเนียนลิเทอรัลที่ใช้แทนเอนัม

ตอบคำถามในบทเรียนแบบโต้ตอบ

ทบทวน

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

เริ่มต้นได้ฟรี

เรียนรู้ TypeScript ด้วย AI tutor — ฟรี

เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป

คอร์ส
101
บทเรียน
352
เริ่มเรียนฟรีดูหลักสูตรเต็ม

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

บทเรียน “Enum เทียบกับ const enum และทางเลือกแบบยูเนียนลิเทอรัล” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “Enum เทียบกับ const enum และทางเลือกแบบยูเนียนลิเทอรัล”

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

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

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

บทเรียน “Enum เทียบกับ const enum และทางเลือกแบบยูเนียนลิเทอรัล” ใช้เวลานานแค่ไหน

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

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

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

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

  1. อาร์เรย์และ ReadonlyArray
  2. ทูเพิลและทูเพิลที่มีป้ายกำกับ
  3. Enum เทียบกับ const enum และทางเลือกแบบยูเนียนลิเทอรัล
← กลับไปที่ TypeScript Academy