Constant Array ใน JavaScript (const Array) เปลี่ยนค่าได้หรือไม่

const arr = [] ป้องกัน Reassign Array ใหม่ แต่ แก้ไข Element ภายในได้

ตัวอย่าง

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Const Array</title>
  <style>
    body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; }
    .result, .sample { font-size: 20px; font-weight: 500; }
  </style>
</head>
<body>
  <h1>Const Array in JavaScript</h1>
  <div class="sample"></div>
  <div style="color: green;" class="result"></div>
  <button class="Btn">CLICK HERE</button>
  <h3> Click to change array values and try reassign </h3>
  <script>
    let sampleEle = document.querySelector(".sample");
    let resEle = document.querySelector(".result");
    const arr = [22, 33, 44, 55];
    sampleEle.innerHTML = "Original Array = " + arr;
    document.querySelector(".Btn").addEventListener("click", () => {
      // Mutate Elements - OK
      arr[0] = 44; arr[1] = 99; arr[2] = 0;
      resEle.innerHTML += "Changed elements: " + arr + '<br>';
      // Reassign Array - Error
      try {
        arr = [11, 11, 11, 11];
      } catch (err) {
        resEle.innerHTML += "Reassign error: " + err;
      }
    });
  </script>
</body>
</html>

คำอธิบาย

• const arr = [1,2,3] - arr ชี้ไปที่ Array ใน Memory
• arr[0] = 99 ✅ - เปลี่ยนค่าภายใน Memory เดิมได้
• arr = [] ❌ - ชี้ไป Memory ใหม่ ไม่ได้ (TypeError)
• Method ที่ Mutate: push, pop, shift, unshift, splice, sort, reverse
• Method ที่คืน Array ใหม่: map, filter, slice, concat, spread [...arr]

ผลลัพธ์

Original: [22,33,44,55] | Changed: [44,99,0,55] | Reassign Error: TypeError