TypeScript基本类型

一、前言

TypeScript 的核心价值在于静态类型系统 。

而要驾驭这个系统，第一步就是掌握它的基本类型（Primitive Types）。

你是否曾疑惑：

• undefined 和 null 有什么区别？
• void 和 undefined 是一回事吗？
• 为什么官方不推荐使用 any？
• never 到底用在什么场景？

本文将带你： ✅ 系统学习 TypeScript 9 大基本类型

✅ 理解每种类型的语义与使用场景

✅ 掌握字面量类型 和联合类型 的进阶用法

✅ 避开 any、隐式 any 等常见陷阱

✅ 写出类型安全、可维护的代码

📌 提示：本文基于 TypeScript 5.x，所有示例均可直接运行。

---

二、TypeScript 的基本类型概览

TypeScript 在 JavaScript 的 7 种原始类型基础上，扩展了 any、void、never 等类型，并支持更精细的控制。

类型	说明
string	字符串
number	数字（包括整数、浮点数、NaN、Infinity）
boolean	布尔值
bigint	大整数（ES2020 新增）
symbol	唯一标识符
undefined	未赋值
null	空值
void	无返回值
never	永不返回（抛出异常或无限循环）

💡 注意：object 不是基本类型 ，它是非原始类型的统称（如 {}、[]、new Date()）。

---

三、逐个详解：9 大基本类型

1. string ------ 字符串

let name: string = "Alice";
let greeting: string = `Hello, ${name}!`; // 模板字符串

✅ 支持所有 JS 字符串操作

✅ 类型推断会自动识别：

let msg = "hello"; // 自动推断为 string

---

2. number ------ 数字

let age: number = 25;
let price: number = 99.9;
let hex: number = 0xff;     // 十六进制
let binary: number = 0b1010; // 二进制

⚠️ 注意：TS 中没有 int、float 区分 ，统一用 number。

---

3. boolean ------ 布尔值

let isActive: boolean = true;
let isLoading: boolean = false;

✅ 仅接受 true 或 false，不接受真值/假值 （如 1、""）：

let ok: boolean = 1; // ❌ 错误！Type '1' is not assignable to type 'boolean'.

---

4. bigint ------ 大整数（ES2020）

用于表示超过 Number.MAX_SAFE_INTEGER 的整数：

let big: bigint = 9007199254740991n;
let huge: bigint = BigInt("9007199254740991");

🔧 需在 tsconfig.json 中设置 "target": "ES2020" 或更高。

---

5. symbol ------ 唯一标识符

let sym1: symbol = Symbol("id");
let sym2: symbol = Symbol("id");

console.log(sym1 === sym2); // false（每次 Symbol() 都唯一）

✅ 常用于对象属性键，避免命名冲突。

---

6. undefined 与 7. null ------ 空值类型

类型	含义	默认值场景
undefined	变量已声明但未赋值	let x; → x 为 undefined
null	明确表示"空"	let user = null;

⚠️ 重要区别：

• undefined 是 JS 引擎自动赋予的"未初始化"状态
• null 是开发者主动赋值的"空值"

严格模式下的行为

在 strictNullChecks: true（默认开启）下：

let u: undefined = undefined; // ✅
let n: null = null;           // ✅
let x: string = null;         // ❌ 错误！

✅ 若需接受 null 或 undefined，使用联合类型：

let maybeName: string | null = null;

---

8. void ------ 无返回值

表示函数没有返回值 （或返回 undefined）：

function log(message: string): void {
  console.log(message);
  // return; // 隐式返回 undefined
}

// ❌ 错误：不能将 void 赋值给变量（除非是 undefined）
let result: void = log("hi"); // 报错！

💡 对比：JS 中函数无 return 时返回 undefined，TS 用 void 明确表达"无意义返回"。

---

9. never ------ 永不返回

表示永远不会正常结束的函数：

• 抛出异常
• 无限循环

function throwError(msg: string): never {
  throw new Error(msg);
}

function infiniteLoop(): never {
  while (true) {}
}

✅ never 是所有类型的子类型，可用于类型收窄：

type Status = "loading" | "success" | "error";

function handleStatus(s: Status): string {
  switch (s) {
    case "loading": return "加载中";
    case "success": return "成功";
    case "error": return "失败";
    default:
      // s 此时为 never（穷尽检查）
      const _exhaustive: never = s;
      throw new Error("Unexpected status");
  }
}

---

四、进阶：字面量类型（Literal Types）

TS 允许将具体值作为类型：

let direction: "left" | "right" | "up" | "down";
direction = "left";  // ✅
direction = "diagonal"; // ❌ 错误！

let statusCode: 200 | 404 | 500 = 200;

✅ 应用场景：

• 枚举替代方案（更轻量）
• API 请求方法限制：method: "GET" | "POST"
• 状态机建模

💡 字面量类型 + 联合类型 = 强大的类型约束！

---

五、特殊类型：any、unknown、never

类型	作用	是否推荐
any	关闭类型检查，"逃逸舱"	❌ 尽量避免
unknown	安全的"任意类型"，需类型守卫	✅ 推荐替代 any
never	永不发生	✅ 用于穷尽性检查

any 的危险示例

let data: any = "hello";
data.toFixed(); // 运行时报错！TS 不检查

unknown 的安全做法

let data: unknown = "hello";
if (typeof data === "string") {
  data.toUpperCase(); // ✅ 安全
}

🌈 最佳实践 ：
"能不用 any 就不用，优先用 unknown + 类型守卫。"

---

六、类型推断（Type Inference）------ TS 的智能

大多数情况下，无需显式标注类型，TS 会自动推断：

let count = 42;        // number
let isActive = true;   // boolean
let names = ["a", "b"]; // string[]

✅ 优势：减少冗余代码

✅ 建议：仅在函数参数、返回值、复杂对象时显式标注

---

七、常见误区与避坑指南

❌ 误区 1：认为 null 和 undefined 是同一种类型

✅ 事实：它们是两种不同的类型，在严格模式下不能互换。

❌ 误区 2：滥用 any 来"绕过"类型错误

✅ 正确做法：使用 unknown + 类型守卫，或定义具体接口。

❌ 误区 3：忽略 strict 模式的重要性

✅ 建议：始终开启 "strict": true（tsconfig.json 中），这是 TS 的灵魂！

---

八、总结：基本类型速查表

类型	示例	用途
string	"hello"	文本
number	42, 3.14	数值
boolean	true / false	逻辑判断
bigint	100n	大整数
symbol	Symbol('id')	唯一键
undefined	let x;	未初始化
null	let y = null;	主动置空
void	函数无返回	表示无意义返回
never	throw new Error()	永不返回

---

九、结语

感谢您的阅读！如果你有任何疑问或想要分享的经验，请在评论区留言交流！