TypeScript Academy · บทเรียน

Enum: ค่าคงที่ตัวเลขและข้อความ

ใช้ enum แทนข้อความและตัวเลขมหัศจรรย์

บทเรียน 4 จาก 413 ขั้นตอน

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

ยินดีต้อนรับ

ชนิดแจงนับช่วยให้คุณกำหนดชุดค่าคงที่ที่มีชื่อได้ ชนิดนี้แทนที่ตัวเลขและสตริงพิเศษที่ไม่มีความหมายด้วยชื่อที่อ่านเข้าใจง่าย ซึ่ง TypeScript บังคับใช้ชนิดให้

ชนิดแจงนับตัวเลข

โดยค่าเริ่มต้น สมาชิกของชนิดแจงนับจะได้รับตัวเลขที่เพิ่มขึ้นอัตโนมัติ โดยเริ่มจาก 0
enum Direction {
  Up,    // 0
  Down,  // 1
  Left,  // 2
  Right, // 3
}
console.log(Direction.Up); // 0

ค่าชนิดแจงนับตัวเลขแบบกำหนดเอง

คุณสามารถกำหนดค่าเริ่มต้นหรือแทนที่ค่าสมาชิกแต่ละตัวได้ สมาชิกถัดไปจะเพิ่มค่าอัตโนมัติจากค่าที่กำหนดล่าสุด
enum Status {
  Active = 1,
  Inactive, // 2
  Banned = 100,
}

ชนิดแจงนับสตริง

ชนิดแจงนับสตริงต้องกำหนดค่าให้สมาชิกแต่ละตัวอย่างชัดเจน ค่าชนิดนี้อ่านเข้าใจง่ายกว่าตัวเลขเมื่อใช้ในบันทึกการทำงานและข้อมูลที่แปลงเป็นรูปแบบสำหรับจัดเก็บหรือส่งต่อ
enum Color {
  Red = 'RED',
  Green = 'GREEN',
  Blue = 'BLUE',
}

การใช้ชนิดแจงนับในฟังก์ชัน

ใช้ชนิดแจงนับเป็นชนิดของพารามิเตอร์เพื่อจำกัดค่าให้อยู่ในชุดที่กำหนดไว้
function move(dir: Direction): void {
  console.log('Moving:', Direction[dir]);
}
move(Direction.Up);

การจับคู่ย้อนกลับ (เฉพาะตัวเลข)

ชนิดแจงนับตัวเลขรองรับการจับคู่ย้อนกลับ คุณสามารถค้นหาชื่อสมาชิกจากค่าของสมาชิกได้ ชนิดแจงนับสตริงไม่รองรับความสามารถนี้
enum Status { Active = 1, Inactive = 2 }
console.log(Status[1]); // 'Active'
console.log(Status.Active); // 1

ชนิดแจงนับแบบ const

`const enum` จะถูกแทรกค่าไว้ตั้งแต่เวลาคอมไพล์ โดยไม่มีการสร้างออบเจ็กต์ JavaScript ผลลัพธ์นี้ช่วยลดขนาดชุดไฟล์ แต่จำกัดการตรวจสอบข้อมูลของชนิดระหว่างทำงาน
const enum Axis { X, Y, Z }
const a = Axis.X; // compiled to: const a = 0;

ชนิดแจงนับเทียบกับยูเนียนของลิเทอรัล

นักพัฒนา TypeScript หลายคนชอบชนิดยูเนียนของลิเทอรัลมากกว่าชนิดแจงนับ เพราะมีน้ำหนักเบากว่าและทำงานได้โดยไม่ต้องมีโค้ดขณะทำงาน
// Enum
enum Dir { Up = 'UP', Down = 'DOWN' }

// Union literal (preferred by many)
type Dir2 = 'UP' | 'DOWN';

ชนิดแจงนับแบบผสม (ควรหลีกเลี่ยง)

การผสมค่าสตริงและตัวเลขไว้ในชนิดแจงนับเดียวกันทำได้ แต่ทำให้สับสน ควรหลีกเลี่ยงรูปแบบนี้
// Avoid:
enum Mixed { A = 1, B = 'bee' }

ชนิดแจงนับเป็นออบเจ็กต์จริงขณะทำงาน

ต่างจากอินเทอร์เฟซและนามแฝงชนิด ชนิดแจงนับจะสร้างโค้ด JavaScript ออกมา ผลลัพธ์ที่คอมไพล์แล้วคือออบเจ็กต์ JavaScript ที่มีทั้งการจับคู่จากชื่อไปยังค่าและจากค่ากลับไปยังชื่อ (สำหรับชนิดแจงนับตัวเลข)

การวนซ้ำค่าของชนิดแจงนับ

ใช้ Object.values() หรือ Object.keys() กับออบเจ็กต์ชนิดแจงนับเพื่อวนซ้ำสมาชิกขณะทำงาน
enum Role { Admin = 'ADMIN', User = 'USER', Guest = 'GUEST' }
const roles = Object.values(Role);
console.log(roles); // ['ADMIN', 'USER', 'GUEST']

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

ชนิดแจงนับใดรองรับการจับคู่ย้อนกลับ (การค้นหาชื่อจากค่า)

สรุปทบทวน

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

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

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

คอร์ส
101
บทเรียน
352

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

บทเรียน “Enum: ค่าคงที่ตัวเลขและข้อความ” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “Enum: ค่าคงที่ตัวเลขและข้อความ”

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

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

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

บทเรียน “Enum: ค่าคงที่ตัวเลขและข้อความ” ใช้เวลานานแค่ไหน

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

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

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

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

  1. อาร์เรย์แบบมีชนิดข้อมูล: T[] และ Array
  2. อาร์เรย์ Readonly และข้อมูลที่แก้ไขไม่ได้
  3. ทูเพิล: อาร์เรย์แบบมีชนิดข้อมูลและความยาวคงที่
  4. Enum: ค่าคงที่ตัวเลขและข้อความ
← กลับไปที่ TypeScript Academy