TypeScript 变量声明详解
TypeScript 的变量声明方式与现代 JavaScript（ES6+）完全一致，主要使用let、const和var（不推荐）。区别在于 TypeScript 增加了静态类型注解，可以在声明时指定变量的类型，从而在编译阶段捕获错误。
1. 基本声明关键字
| 关键字 | 作用域 | 是否可重新赋值 | 是否可重新声明 | 推荐场景 |
|---|---|---|---|---|
const | 块级作用域 | 不可 | 不可 | 常量、不会改变的值 |
let | 块级作用域 | 可 | 不可 | 需要重新赋值的变量 |
var | 函数作用域（或全局） | 可 | 可 | 不推荐（易导致 bug） |
2. 声明语法与类型注解
基本格式：
// 无类型注解（依靠类型推断）letvariableName=value;// 带类型注解letvariableName:type=value;// const 同理constconstantName:type=value;示例对比
// 1. const（推荐用于不变值）constPI:number=3.14159;// 显式类型注解constusername="Alice";// 类型推断为 string（推荐，简洁）// username = "Bob"; // 错误：const 不可重新赋值// 2. let（用于可变变量）letage:number=25;// 显式注解age=26;// OKletscore=100;// 类型推断为 numberscore=200;// OK// score = "high"; // 错误：类型不匹配// 3. var（不推荐）varoldStyle="legacy";// oldStyle = 123; // JS 中允许，但 TS 会根据首次赋值推断类型3. 类型注解的位置与类型推断
- 推荐优先使用类型推断：大多数情况下无需显式写类型，TS 会自动推断。
- 显式注解的场景：
- 初始化值是
null或undefined时。 - 函数参数和返回值。
- 复杂对象、联合类型等。
- 初始化值是
letname:string;// 声明但未初始化（必须显式类型）name="Alice";letnullable:string|null=null;// 联合类型letdata:any="anything";// 关闭类型检查（慎用）4. 特殊声明方式
a. 解构赋值（Destructuring）
// 数组解构const[first,second]:[number,number]=[1,2];// 对象解构interfaceUser{name:string;age:number;}const{name,age}:User={name:"Bob",age:30};// 部分解构 + 重命名const{name:userName,age}:{name:string;age:number}={name:"Charlie",age:28};b. 默认值与可选属性
functiongreet(name:string="Guest"):string{return`Hello${name}`;}greet();// "Hello Guest"greet("Dave");// "Hello Dave"c. 展开运算符（Spread）
constdefaults={timeout:1000,retries:3};constconfig:typeofdefaults={...defaults,timeout:5000};5. 作用域示例（let vs var）
if(true){letblockScoped="only here";// 块外不可访问varfunctionScoped="everywhere";}console.log(functionScoped);// OK// console.log(blockScoped); // 错误：未定义6. 最佳实践建议
- 优先使用
const，需要修改时再改用let。 - 永远不要使用
var（容易造成变量提升和作用域污染）。 - 大多数情况依靠类型推断，只在必要时添加显式类型。
- 开启严格模式（
strict: true），包括noImplicitAny等。 - 对于对象和数组，推荐使用接口或类型别名定义结构。
// 推荐：定义接口后声明变量interfacePoint{x:number;y:number;}constorigin:Point={x:0,y:0};letposition:Point={x:10,y:20};小结：常见声明模式速查
| 场景 | 推荐写法 |
|---|---|
| 常量字符串/数字 | const NAME = "Alice"; |
| 可变值 | let count = 0; |
| 明确类型（复杂） | let ids: number[] = []; |
| 对象 | const user: { name: string; age: number } = ...或使用 interface |
| 可能为空 | `let element: HTMLElement |
如果您想深入了解函数参数声明、类属性声明、模块内声明或其他高级场景（如声明合并、声明文件.d.ts），请告诉我！