对象字面量

2025-09-09 00:00

在 TypeScript 中，对象字面量（Object Literal）是通过花括号 {} 来创建一个对象，并可以直接为其添加属性和值。这与 JavaScript 中的对象字面量使用方式类似，但 TypeScript 为对象字面量提供了类型系统，可以通过类型注解来限制对象的结构。

1. 基本的对象字面量

对象字面量用于创建一个新的对象，可以直接指定其属性和值：

1const person = {
2  name: "Alice",
3  age: 30
4};

这里 person 是一个对象字面量，包含了两个属性：name 和 age。

2. 使用类型注解指定对象字面量的类型

TypeScript 允许你为对象字面量指定类型，从而限制对象的属性和类型。这使得代码更加安全，能够防止错误的属性赋值。

示例：使用 type 或 interface 定义对象类型

1interface Person {
2  name: string;
3  age: number;
4}
5
6const person: Person = {
7  name: "Alice",
8  age: 30
9};

在这个例子中，Person 是一个接口（interface），它定义了 name 和 age 属性的类型。然后我们通过类型注解 const person: Person 来确保 person 对象符合这个类型。

你也可以使用 type 来定义类型：

1type Person = {
2  name: string;
3  age: number;
4};
5
6const person: Person = {
7  name: "Alice",
8  age: 30
9};

3. 在对象字面量中使用可选属性

在对象字面量中，你可以定义可选属性，通过在属性名后添加 ? 来实现。

 1interface Person {
 2  name: string;
 3  age: number;
 4  address?: string; // 可选属性
 5}
 6
 7const person: Person = {
 8  name: "Alice",
 9  age: 30
10  // address 是可选的，可以不提供
11};

在这个例子中，address 属性是可选的，因此你可以在创建 person 对象时不提供该属性。

4. 只读属性

TypeScript 还允许你为对象字面量定义只读属性，这意味着这些属性的值在初始化后不能被修改。可以使用 readonly 修饰符来实现。

 1interface Person {
 2  readonly name: string;
 3  readonly age: number;
 4}
 5
 6const person: Person = {
 7  name: "Alice",
 8  age: 30
 9};
10
11// person.name = "Bob"; // 这是不允许的，会报错

在这个例子中，name 和 age 是只读的，因此你不能修改它们的值。

5. 对象字面量与函数类型

你还可以将方法作为对象字面量的一部分来使用。函数类型可以在对象字面量中直接定义。

 1interface Person {
 2  name: string;
 3  greet: () => void; // greet 是一个函数
 4}
 5
 6const person: Person = {
 7  name: "Alice",
 8  greet: () => {
 9    console.log(`Hello, my name is ${person.name}`);
10  }
11};
12
13person.greet(); // 输出：Hello, my name is Alice

6. 使用索引签名

索引签名允许对象字面量具有任意数量的属性，并且这些属性的类型是预定义的。通过 index signature，你可以指定对象可以有任意数量的键，并限制键值的类型。

 1interface Dictionary {
 2  [key: string]: number; // 键是 string 类型，值是 number 类型
 3}
 4
 5const myDictionary: Dictionary = {
 6  apple: 10,
 7  banana: 20
 8};
 9
10console.log(myDictionary.apple);  // 输出：10

在这个例子中，Dictionary 接口定义了一个索引签名，允许任何字符串键，且这些键对应的值都必须是 number 类型。

7. 使用类型推断

TypeScript 会自动推断字面量对象的类型。如果你没有显式地为对象指定类型，TypeScript 会根据对象的结构自动推断类型。

1const person = {
2  name: "Alice",
3  age: 30
4};  // TypeScript 推断 person 的类型为 { name: string; age: number; }
5
6person.name = "Bob";  // 允许修改
7// person.name = 100;  // 错误，因为 name 应该是 string 类型

8. 禁止额外的属性

有时，你希望对象字面量只能包含某些特定的属性，禁止添加任何额外的属性。可以使用 exact 类型来实现这一点（通过 as const 来确保字面量类型的精确性）。

1const person = {
2  name: "Alice",
3  age: 30
4} as const;  // 使用 'as const' 来确保属性是只读的并且精确匹配
5
6// person.name = "Bob";  // 错误，因为 'name' 是只读的，不能修改
7// person.address = "NY";  // 错误，因为 `address` 属性并不在对象字面量中

总结

通过这些方式，你可以在 TypeScript 中创建灵活、类型安全的对象字面量。