TypeScript 简介

TypeScript(简称 TS)是微软开发并维护的一门开源编程语言。它是 JavaScript 的超集:在 JS 的基础上增加了静态类型系统,编译后仍输出标准 JavaScript,因此浏览器、Node.js、小程序等所有能跑 JS 的环境都能运行 TS。一句话概括学习理由:JS 能写的 TS 都能写,JS 要到运行时才暴露的错误,TS 在编写阶段就能拦截。

TypeScript 是什么

  • 微软于 2012 年发布,核心作者是 Anders Hejlsberg(C# 之父)。
  • 语法 = JavaScript 语法 + 类型注解 + 额外的语言特性(接口、枚举、泛型等)。
  • 官方提供编译器 tsc,把 .ts 文件"降级"编译成各环境都认的 .js 文件。

为什么学 TypeScript

  1. 更早发现错误:拼错属性名、传错参数类型,保存代码的瞬间就能看到红波浪线。
  2. 代码即文档:函数参数、对象结构都写在签名里,接手老项目不再靠猜。
  3. 重构更安全:改一个接口,编译器会提示所有受影响的调用点。
  4. 生态成熟:VS Code 官方支持,Vue 3、React、Angular、NestJS 均深度集成 TS。

TS 与 JS 的关系

  • 超集关系:任何合法的 JS 代码,同时也是一份合法的 TS 代码。
  • TS 不能直接被浏览器执行,需要先编译成 JS,运行时行为仍由 JS 决定。
  • 类型只存在于编译期,编译后全部擦除,不带来额外运行开销。
  • 记住公式:TS = JS + 类型系统 + 接口/枚举/泛型等扩展语法

最小示例

下面这段代码本身也是合法 JS,只是多了一个 : string 类型标注:

// hello.ts
let message: string = "你好,TypeScript!";
console.log(message); // 输出:你好,TypeScript!

编译与运行两步:

tsc hello.ts   // 生成 hello.js
node hello.js  // 运行 hello.js

运行结果:

你好,TypeScript!

类型错误示例

给函数标注参数类型后,调用出错在编译期就会被拦截:

function greet(name: string): string {
    return "Hello, " + name;
}

greet("TypeScript"); // 编译通过
greet(42);           // 编译报错,见下方信息

编译结果:

error TS2345: Argument of type 'number' is not assignable
to parameter of type 'string'.

典型应用场景

  • 前端:用 TS 开发 Vue 3 / React 组件,状态与 props 全程有类型约束。
  • 后端:NestJS 等框架基于 TS,写出结构清晰的 Node.js 服务。
  • 库作者:用 TS 编写 npm 包,同时产出 .d.ts 类型声明供他人使用。
  • 官方文档可参考 https://example.com 上的 TypeScript 资料。

小结

TypeScript 是 JavaScript 的超集,用「编译期类型检查」换来更可靠、更易维护的代码,是现代 Web 与 Node.js 开发的事实标准。下一节我们先安装开发环境,跑通第一个程序。

笔记加载中…