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

ตัวปรับแต่ง public, private และ protected

ควบคุมการเข้าถึงสมาชิกของคลาสด้วยตัวปรับแต่ง

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

เริ่มต้นใช้งาน

ตัวปรับการเข้าถึงของ TypeScript ควบคุมการมองเห็นสมาชิกของคลาส ช่วยบังคับใช้การห่อหุ้มและป้องกันการใช้งานที่ไม่ตั้งใจ

public: เข้าถึงได้ทุกที่

public เป็นค่าเริ่มต้น สมาชิกแบบสาธารณะเข้าถึงได้จากทุกที่ ทั้งภายในคลาส คลาสย่อย และโค้ดภายนอก
class Car {
  public brand: string;
  constructor(brand: string) { this.brand = brand; }
}
const c = new Car('Toyota');
console.log(c.brand); // OK

private: เข้าถึงได้เฉพาะในคลาส

สมาชิกแบบส่วนตัวเข้าถึงได้เฉพาะภายในคลาสที่ประกาศสมาชิกนั้น คลาสย่อยและโค้ดภายนอกไม่สามารถเข้าถึงได้
class BankAccount {
  private balance: number = 0;
  deposit(n: number) { this.balance += n; }
}
const a = new BankAccount();
// a.balance; // Error!

protected: คลาสและคลาสย่อยเข้าถึงได้

สมาชิกแบบมีการป้องกันเข้าถึงได้ภายในคลาสที่ประกาศและคลาสย่อยใด ๆ แต่ไม่สามารถเข้าถึงจากโค้ดภายนอกได้
class Animal {
  protected name: string;
  constructor(name: string) { this.name = name; }
}
class Dog extends Animal {
  bark() { console.log(this.name + ' says woof!'); } // OK
}

การบังคับใช้เฉพาะขณะคอมไพล์

ตัวปรับการเข้าถึงของ TypeScript เป็นเพียงการตรวจสอบขณะคอมไพล์เท่านั้น ผลลัพธ์ JavaScript ยังคงมีพร็อพเพอร์ตีสาธารณะ และไม่มีการบังคับใช้ขณะทำงาน

สมาชิกส่วนตัวของ JavaScript ด้วย #

JavaScript มีฟิลด์ส่วนตัวแบบเนทีฟด้วย `#` ซึ่งบังคับใช้ขณะทำงาน TypeScript รองรับไวยากรณ์นี้ควบคู่กับคีย์เวิร์ด `private` ของตนเอง
class Counter {
  #count = 0; // runtime private (JavaScript)
  increment() { this.#count++; }
  get value() { return this.#count; }
}

ตัวปรับ readonly

พร็อพเพอร์ตี readonly สามารถกำหนดค่าได้เฉพาะระหว่างการสร้างเท่านั้น และไม่สามารถเปลี่ยนแปลงหลังจากเริ่มต้นค่าแล้ว
class User {
  readonly id: number;
  constructor(id: number) { this.id = id; }
}
const u = new User(1);
// u.id = 2; // Error!

การใช้ตัวปรับหลายรายการร่วมกัน

คุณสามารถใช้ตัวปรับการเข้าถึงร่วมกับ readonly บนพร็อพเพอร์ตีเดียวกันได้
class Config {
  constructor(
    public readonly host: string,
    private readonly port: number
  ) {}
}

private กับตัวสร้าง

การกำหนดให้ตัวสร้างเป็น private จะป้องกันการสร้างอินสแตนซ์จากภายนอก ให้ใช้เมธอดตัวสร้างแบบสแตติกแทน
class Singleton {
  private static instance: Singleton;
  private constructor() {}
  static getInstance(): Singleton {
    return this.instance ??= new Singleton();
  }
}

ตัวสร้างแบบ protected

ตัวสร้างแบบ protected ป้องกันการสร้างอินสแตนซ์โดยตรง แต่อนุญาตให้คลาสย่อยเรียกใช้ผ่าน super() ได้
class Base {
  protected constructor(public id: number) {}
}
class Derived extends Base {
  constructor(id: number) { super(id); }
}

ตัวปรับการเข้าถึงไม่เพิ่มภาระขณะทำงาน

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

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

ตัวปรับการเข้าถึงใดทำให้สมาชิกของคลาสเข้าถึงได้ทั้งภายในคลาสและคลาสย่อย แต่ไม่สามารถเข้าถึงจากโค้ดภายนอกได้

สรุปทบทวน

ใช้ public ซึ่งเป็นค่าเริ่มต้นสำหรับสมาชิกที่เข้าถึงได้ ใช้ private สำหรับส่วนภายในที่ต้องห่อหุ้ม และใช้ protected สำหรับสมาชิกที่ตั้งใจให้คลาสย่อยใช้งาน เพิ่ม readonly เพื่อป้องกันการเปลี่ยนแปลงหลังการสร้าง

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

บทเรียน “ตัวปรับแต่ง public, private และ protected” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “ตัวปรับแต่ง public, private และ protected”

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

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

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

บทเรียน “ตัวปรับแต่ง public, private และ protected” ใช้เวลานานแค่ไหน

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

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

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

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

  1. คลาสและคอนสตรักเตอร์ของ TypeScript
  2. ตัวปรับแต่ง public, private และ protected
  3. พร็อพเพอร์ตี readonly และพร็อพเพอร์ตีของพารามิเตอร์
  4. การใช้อินเทอร์เฟซกับคลาส
← กลับไปที่ TypeScript Academy