อายุการใช้งาน (Lifetime) ของตัวแปร JavaScript

นิยาม

Lifetime (อายุการใช้งาน) ของตัวแปร JavaScript เริ่มต้นเมื่อถูกประกาศ (Declared)

ประเภทตัวแปรตามขอบเขต (Scope)

1. Local Variable (ตัวแปรท้องถิ่น)

• ประกาศภายในฟังก์ชัน (var, let, const)
• เข้าถึงได้เฉพาะภายในฟังก์ชันนั้นๆ
• Parameter ของฟังก์ชันก็เป็น Local Variable เสมอ
• ถูกทำลาย (Destroyed) เมื่อฟังก์ชันทำงานเสร็จ

2. Global Variable (ตัวแปรส่วนกลาง)

• ประกาศนอกฟังก์ชัน (หรือไม่ใช้ var/let/const ใน Non-Strict Mode)
• เข้าถึงได้จากทุกที่ในโค้ด JavaScript
• ถูกทำลายเมื่อปิด Web Browser
• ถ้าโหลดหน้าใหม่ใน Tab เดียวกัน Global Variable จะหายไป (เพราะ Context ใหม่)

ตัวอย่าง: Global vs Local Scope

<html>
<body onload="checkscope()">
  <script>
    var myVar = "global"; // Global variable
    
    function checkscope() {
      var myVar = "local"; // Local variable (ชื่อซ้ำได้)
      document.write(myVar); // แสดง "local"
    }
  </script>
</body>
</html>

ผลลัพธ์

local

Hoisting และ Temporal Dead Zone

Block Scope (ES6+)

if (true) {
  var a = 1;     // Function/Global scope
  let b = 2;     // Block scope
  const c = 3;   // Block scope
}
console.log(a); // 1
console.log(b); // ReferenceError
console.log(c); // ReferenceError

Best Practices

• ใช้ const โดยค่าเริ่มต้น, let ถ้าต้องเปลี่ยนค่า, หลีกเลี่ยง var
• ประกาศตัวแปรให้ใกล้จุดที่ใช้มากที่สุด (Block Scope)
• ลด Global Variables ให้น้อยที่สุด (ใช้ Module Pattern หรือ ES Modules)
• เข้าใจ Closure: ฟังก์ชันภายในเข้าถึงตัวแปรภายนอกได้แม้ฟังก์ชันภายนอกจบแล้ว

สรุป

Lifetime ของตัวแปรขึ้นอยู่กับ Scope: Local Variable ตายเมื่อฟังก์ชันจบ, Global Variable ตายเมื่อปิด Browser ใช้ let/const เพื่อ Block Scope ที่ชัดเจนและปลอดภัยกว่า