TypeScript变量声明讲解
把 TS 的变量声明看成“给盒子贴标签 + 上锁”的过程：
先决定盒子叫什么名字、装什么类型的东西、能不能换东西、在哪层楼能用。
一、三种声明关键字
| 关键字 | 作用域 | 是否可变 | 是否可重复声明 | 推荐场景 |
|---|---|---|---|---|
const | 块级 {...} | ❌ 不能重新赋值 | ❌ | 默认首选（最安全） |
let | 块级 {...} | ✅ 可以重新赋值 | ❌ | 值需要改变时 |
var | 函数级 | ✅ 可以重新赋值 | ✅ | 旧代码兼容，新项目不用 |
二、写类型的 4 种姿势
-
直接标注（最常用）
const age: number = 18; let name: string; -
类型推断（省字）
const age = 18; // TS 自动推断为 number -
联合类型（一盒多格）
let id: number | string; -
泛型 + 工具类型（高级模板）
type User = { name: string; age?: number }; const user: Partial<User> = {}; // 所有属性可选
三、推荐写法口诀
-
默认
const
能不动就不动，防止手滑改错。 -
需要改再用
let
循环计数器、累加值等。 -
别用
var
作用域怪坑多，除非维护老代码。 -
先推断，后标注
简单类型让 TS 自己猜，复杂/联合/泛型再手写。 -
对象先写接口 / type
interface User { name: string; age: number; } const user: User = { name: 'Tom', age: 20 };
四、完整示例
// 1. 常量不改
const API_URL = 'https://api.xxx.com';// 2. 循环里会变
for (let i = 0; i < 5; i++) { /* ... */ }// 3. 联合类型
let result: 'success' | 'error' = 'success';// 4. 对象类型
interface Person {readonly id: number; // 只读，像身份证号name: string;age?: number; // 可选
}
const tom: Person = { id: 1, name: 'Tom' };
记住顺口溜：
“先 const 后 let，var 扔掉别回忆；简单推断复杂标，对象接口先设计。”