TypeScript 入门

type

status

date

slug

summary

本文适合 JavaScript 开发者,对TypeScript类型系统进行详细介绍，通过简明的例子带你入门 TypeScript。

一、什么是 TypeScript？

TypeScript（简称 TS）是 JavaScript 的超集，提供了静态类型检查、面向对象编程能力，最终编译为纯 JavaScript。

它由微软开发，广泛应用于中大型前端项目。其核心特性：

✅ 类型系统：编写代码时即可检查类型错误，减少运行时 bug。

✅ 开发体验好：IDE 提示更智能，跳转与补全更准确。

✅ 向后兼容：可以与现有 JavaScript 项目无缝衔接。

举个例子：

TypeScript 在开发阶段帮助你提前发现问题，大大提升代码健壮性与维护性。

二、TypeScript 基础类型

TypeScript 提供了一套丰富的类型体系。以下是最常用的基本类型。

1. `boolean` 布尔值

2. `number` 数字

3. `string` 字符串

4. `Array` 数组

有两种方式定义数组：

5. `Tuple` 元组（固定长度、类型的数组）

6. `enum` 枚举

7. `any` 任意类型

用于绕过类型检查（不推荐频繁使用）

8. `void` 无返回值

9. `null` 和 `undefined`

10. `never` 永不存在的值

三、对象类型

对象类型涵盖类、数组、函数等复杂结构。

类（Class）

数组（Array）

函数（Function）

可以为函数参数和返回值显式定义类型。

函数重载

允许一个函数根据参数数量或类型有多种定义方式：

四、类型断言（Type Assertion）

类型断言用于告诉编译器某个值的具体类型，可用于绕过自动推断或解决类型不明确的问题。

有两种语法：

五、联合类型（Union Types）

表示一个值可以是多种类型之一。

六、类型别名（Type Alias）

为复杂类型定义一个别名，提高代码可读性。

七、交叉类型（Intersection Types）

将多个类型合并成一个类型。

八、类型守卫（Type Guards）

类型守卫用于缩小联合类型的范围。

九、接口（Interface）

接口用于定义对象的结构，可以被类实现，也可以用于对象字面量。

十、泛型（Generics）

泛型提供了创建可重用组件的能力，可用于函数、类、接口等。

泛型使代码更具通用性与类型安全。

十一、总结

TypeScript 是构建大型项目的理想选择。

拥有强大的类型系统和更好的开发体验。

掌握基础类型 + 对象类型进阶，是写出高质量 TS 代码的基础。

TypeScript 与 JavaScript 的主要区别

特性	JavaScript	TypeScript
类型系统	动态类型	静态类型
编译检查	运行时报错	编译时报错
面向对象支持	有限（通过原型链实现）	强（支持类、接口、继承等）
代码可维护性	较低，依赖测试和文档	高，IDE 提示友好，bug 率低
学习曲线	简单	稍陡（但对于大型项目非常值得）