# TypeScript 学习笔记 - as const

假设我们定义了一个 `colors` 变量

```typescript
const colors: { [prop: string]: string } = {
    red: '#f00',
    white: '#fff',
    black: '#000',
};
```

之后我们想要在程序的其他地方使用这个变量时，可能会得到这样的提示

![](https://cdn.jsdelivr.net/gh/suukii/Articles/assets/ts/ts_as_const_0.png)

提示告诉我们，`black` 的类型是 `string`，但如果我们想要知道 `black` 的值是什么，就得回到 `colors` 的定义处查询。

如果我们加上 `as const`，再来看看提示

```typescript
const colors: { [prop: string]: string } = {
    red: '#f00',
    white: '#fff',
    black: '#000',
} as const;
```

![](https://cdn.jsdelivr.net/gh/suukii/Articles/assets/ts/ts_as_const_1.png)

这次提示不仅告诉了我们 `black` 属性是 `string` 类型的，还把它的值 `#000` 也提示出来了。

`as const` 还有一个用途，就是把对象的属性都变成 `readonly`，而且这个作用对于**嵌套属性**也是生效的。

![](https://cdn.jsdelivr.net/gh/suukii/Articles/assets/ts/ts_as_const_2.png)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://suki.gitbook.io/notes/articles/typescript/typescript_as_const.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.