วิธีกำหนด Getter และ Setter Functions ใน JavaScript

Getter

เมื่อเข้าถึง property ค่าจะได้จากการเรียกฟังก์ชันโดยนัย ใช้คีย์เวิร์ด get ใน JavaScript

Setter

เมื่อตั้งค่า property จะเรียกฟังก์ชันโดยนัย ค่าถูกส่งเป็น argument คืนค่าเป็น property เอง ใช้คีย์เวิร์ด set ใน JavaScript

ตัวอย่าง

<html> 
  <body> 
    <script> 
      var department = { 
        deptName: "Marketing", 
        deptZone: "North", 
        deptID: 101, 
        get details() { 
          return "Department Details<br>" + "Name: " + this.deptName + " <br>Zone: " + this.deptZone + "<br>ID: " + this.deptID; 
        }, 
        set details(info) { 
          var words = info.toString().split(' '); 
          this.deptName = words[0] || ''; 
          this.deptZone = words[1] || ''; 
          this.deptID = words[2] || ''; 
        } 
      }; 
      department.details = 'Marketing North 001'; 
      document.write(department.deptName); 
      document.write(department.deptZone); 
      document.write(department.deptID); 
    </script> 
  </body> 
</html>

Syntax แบบต่างๆ

// 1. Object literal (ES5+)
const obj = {
  _value: 0,
  get value() { return this._value; },
  set value(v) { this._value = v; }
};

// 2. Class (ES6+)
class MyClass {
  constructor() { this._value = 0; }
  get value() { return this._value; }
  set value(v) { this._value = v; }
}

// 3. Object.defineProperty (ES5 - รองรับ configurable, enumerable)
const obj2 = { _value: 0 };
Object.defineProperty(obj2, 'value', {
  get() { return this._value; },
  set(v) { this._value = v; },
  enumerable: true,
  configurable: true
});

// 4. Object.defineProperties (หลาย properties พร้อมกัน)
Object.defineProperties(obj, {
  prop1: { get() { return 1; }, set(v) { } },
  prop2: { get() { return 2; }, set(v) { } }
});

Use Cases

• Validation ก่อนตั้งค่า
• Computed properties (คำนวณจาก properties อื่น)
• Lazy evaluation
• Proxy/observability patterns
• Backward compatibility (รองรับ API เก่า)