วิธี Freeze Object ใน JavaScript ด้วย Object.freeze()

Object.freeze() - ทำให้ Object Immutable

freeze() ป้องกัน: เพิ่ม Property ใหม่, ลบ Property, แก้ไข Property, เปลี่ยน Prototype, เปลี่ยน Property Attributes (writable, configurable, enumerable)

ไวยากรณ์

Object.freeze(obj)

Return: Object เดียวกัน (Frozen) - ไม่สร้าง Copy

ตัวอย่าง

<html> <body> <script>
  var myObj = {
    prop1: 'frozen values cannot be changed'
  };
  
  var frozenObj = Object.freeze(myObj);
  
  // พยายามเปลี่ยนค่า
  frozenObj.prop1 = 'change the frozen value';
  
  // Strict Mode จะ Throw Error, Non-strict จะ Fail Silently
  document.write(frozenObj.prop1);
</script> </body> </html>

ผลลัพธ์

frozen values cannot be changed

Shallow Freeze (ข้อควรระวัง!)

const obj = {
  name: 'John',
  address: { city: 'Bangkok' } // Nested Object
};

Object.freeze(obj);
obj.address.city = 'Chiang Mai'; // สำเร็จ! Nested ไม่ Freeze
console.log(obj.address.city); // 'Chiang Mai'

Deep Freeze Function

function deepFreeze(obj) {
  Object.freeze(obj);
  Object.keys(obj).forEach(key => {
    if (typeof obj[key] === 'object' && obj[key] !== null) {
      deepFreeze(obj[key]);
    }
  });
  return obj;
}

การตรวจสอบ

Object.isFrozen(obj); // true/false

Related Methods

Method	Prevent Extensions	Prevent Config Changes	Prevent Value Changes
preventExtensions()	✓	✗	✗
seal()	✓	✓	✗
freeze()	✓	✓	✓