TypeScript 类型体操 —— Readonly

265 阅读1分钟

题目地址

readonly

readonly 在 TypeScript 中是一个修饰符,用于标识对象或数组的属性是只读的,不能被修改。

例如,以下是一个使用 readonly 的示例:

interface Point {
    readonly x: number;
    readonly y: number;
}

const point: Point = { x: 10, y: 20 };

// 这样是不允许的,因为 x 是只读的
point.x = 30;

Readonly

Readonly 是 TypeScript 中的一种内置类型,可以将任意对象类型作为只读类型进行使用。这样,就可以保证对象的属性不会被意外修改。

可以使用 Readonly 类型声明任意对象类型为只读类型:

let point = { x: 10, y: 20 };
let readOnlyPoint: Readonly<typeof point> = point;
readOnlyPoint.x = 30;  // Error: Cannot assign to 'x' because it is a read-only property.

可以看到,使用 Readonly 类型定义的变量是不可修改的。如果试图修改只读属性,编译器将抛出错误。

这对于需要在程序中使用不可变对象的场景非常有用,因为它可以避免因意外修改对象的状态而导致的问题。

实现 Readonly

type Readonly<T> = {
    readonly [P in keyof T]: T[P];
};

const obj = { a: 1, b: { c: 2 } };
const readonlyObj: Readonly<typeof obj> = obj;

// 这样是不允许的,因为 obj 和 readonlyObj 都是只读的
readonlyObj.a = 2;
readonlyObj.b.c = 3;

在以上代码中,定义了一个名为 Readonly 的类型别名,该类型别名递归地将对象的所有字段标记为只读的。最后,使用 readonly 类型别名将 obj 对象转换为只读对象 readonlyObj。试图更改 readonlyObj 中的任何字段时,都会出现编译错误。