อาร์เรย์ Readonly และข้อมูลที่แก้ไขไม่ได้

ยินดีต้อนรับ

ตัวปรับ readonly สำหรับอาร์เรย์

const ids: readonly number[] = [1, 2, 3];
// ids.push(4);   // Error
// ids[0] = 99;   // Error
console.log(ids[0]); // OK — reading is fine

รูปแบบทั่วไป ReadonlyArray<T>

const names: ReadonlyArray<string> = ['Alice', 'Bob'];
// names.push('Charlie'); // Error

การคืนอาร์เรย์แบบอ่านอย่างเดียวจากฟังก์ชัน

function getConfig(): readonly string[] {
  return ['host', 'port', 'db'];
}

พารามิเตอร์ฟังก์ชันที่ไม่เปลี่ยนแปลง

function sum(nums: readonly number[]): number {
  return nums.reduce((a, b) => a + b, 0);
  // nums.push(99); // Error inside function
}

as const สำหรับอาร์เรย์ลิเทอรัล

const colors = ['red', 'green', 'blue'] as const;
// type: readonly ['red', 'green', 'blue']
// colors.push('yellow'); // Error

readonly ไม่ได้แช่แข็งข้อมูลในระดับลึก

const users: readonly { name: string }[] = [{ name: 'Alice' }];
// users.push({}); // Error
users[0].name = 'Bob'; // Allowed — object itself is mutable

ความไม่เปลี่ยนแปลงในระดับลึกด้วย Readonly<T>

type ImmutableUser = Readonly<{ name: string; scores: readonly number[] }>;
const u: ImmutableUser = { name: 'Alice', scores: [90, 85] };
// u.name = 'Bob';       // Error
// u.scores.push(100);  // Error

การกำหนดระหว่างอาร์เรย์ที่เปลี่ยนแปลงได้กับอาร์เรย์แบบอ่านอย่างเดียว

const ro: readonly number[] = [1, 2];
const mutable: number[] = ro; // Error!

เมื่อใดควรใช้อาร์เรย์แบบอ่านอย่างเดียว

การกระจายจะสร้างอาร์เรย์ใหม่ที่เปลี่ยนแปลงได้

const base: readonly number[] = [1, 2, 3];
const extended: number[] = [...base, 4]; // new mutable array

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

สรุปทบทวน