在 TypeScript 中，const 和 readonly 都是用来确保变量或对象的不可变性，但它们的作用范围和使用场景有所不同。
const
const 是 JavaScript 和 TypeScript 中的一种声明变量的方式，用来定义常量。它用于确保变量的值在声明后不能被重新赋值。const 只影响变量的绑定，而不是对象或数组本身的可变性。
-
作用：确保变量的引用不可改变（即不能重新赋值）。
-
范围：只作用于变量的绑定，不会影响对象或数组内部的内容。
如下例子所示：
const x = 10;
// x = 20; // 错误：不能重新赋值
const arr = [1, 2, 3];
arr.push(4); // 允许：数组本身的内容可以修改
// arr = [4, 5, 6]; // 错误：不能重新赋值整个数组在上面的代码中，x 被声明为常量，不能重新赋值。而 arr 的内容可以被修改，比如使用 push() 方法添加新元素，但不能将 arr 重新赋值为一个新的数组。
readonly
readonly 是 TypeScript 类型系统的一部分，它实际上并不改变运行时的行为，而是通过 类型检查 来保证不可修改性。具体来说，readonly 修饰符会使得对象的属性或数组的元素变得 只读，并且在类型检查阶段，TypeScript 会在编译时报告试图修改这些属性或元素的操作。
-
作用：确保对象或数组的内容不可修改（即属性不可写）。
-
范围：影响对象或数组中的元素（值本身），而不是变量的绑定。
如下例子所示：
interface Person {
readonly name: string;
readonly age: number;
}
const person: Person = { name: 'Alice', age: 25 };
person.name = 'Bob'; // 错误：不能修改 readonly 属性在上面的例子中，name 和 age 被标记为 readonly，这意味着一旦为 person 对象赋值后，不能再修改这些属性的值。
对于数组，也可以使用 readonly 来确保数组的内容不可更改：
const numbers: readonly number[] = [1, 2, 3];
numbers.push(4); // 错误：不能修改 readonly 数组
// numbers = [4, 5, 6]; // 错误：不能重新赋值整个数组在这里，numbers 被声明为只读数组，意味着不能对其内容进行任何修改。
const 和 readonly 的区别
| 特性 | const | readonly |
|---|---|---|
| 作用对象 | 变量绑定（不能重新赋值） | 对象的属性或数组的元素（不能修改其值） |
| 修改对象内容 | 允许修改对象的内容（如果对象是可变的） | 不允许修改对象的内容或数组的元素 |
| 作用范围 | 只作用于变量的绑定，限制的是变量的引用 | 作用于对象或数组元素，限制的是元素的可变性 |
| 数组示例 | 允许修改数组内容，但不能重新赋值整个数组 | 不能修改数组内容，包括添加、删除、修改元素 |
| 对象示例 | 允许修改对象的属性值，但不能重新赋值整个对象 | 不能修改对象的属性值，确保对象的属性为只读 |
结合使用 const 和 readonly
在某些情况下，你可能需要同时使用 const 和 readonly 来保证变量绑定和对象属性的不可变性。比如，你可以使用 const 来确保变量不重新赋值，使用 readonly 来确保对象或数组的元素不被修改。
// 使用 const 和 readonly 确保不可变性
const person: { readonly name: string; readonly age: number } = {
name: 'Alice',
age: 25,
};
// person = { name: 'Bob', age: 30 }; // 错误：不能重新赋值整个对象
person.name = 'Bob'; // 错误：不能修改 readonly 属性在这个例子中，const 保证 person 不能被重新赋值，readonly 保证 name 和 age 不能修改。
总结
const 用于确保变量的引用不可重新赋值，但不影响对象或数组内部的内容；而 readonly 用于确保对象的属性或数组的元素不可修改，常用于保证数据结构的不可变性。两者的主要区别在于，const 限制的是变量的绑定，readonly 限制的是对象或数组的元素的可变性。