TypeScript与javascript是怎样的关系【教程】

12次阅读

typescriptjavaScript超集,编译时擦除类型、零运行时开销;any绕过检查,unknown需类型守卫;Interface支持声明合并和实现,type支持联合与元组;strict配置和CI校验决定其实际价值。

TypeScript与javascript是怎样的关系【教程】

TypeScript 是 javascript 的超集,不是新语言,也不是替代品——所有合法的 JavaScript 代码(比如 let x = 1;function foo() {})直接改成 .ts 后缀就能通过 tsc 编译,只是没类型保护而已。

为什么改个后缀就能跑?因为类型在编译时被完全擦除

TypeScript 的核心设计是“零运行时开销”:你写的 const name: String = 42; 会报错,但即使忽略它,tsc 默认仍会输出 const name = 42; 这样的纯 JavaScript。这意味着:

  • tsc 不是 Babel 那类语法转译器,默认不降级语法(除非显式配置 target
  • 类型标注(interfacetype泛型参数等)全部在编译阶段移除,不留下任何痕迹
  • 错误不会自动阻止输出 js 文件——得靠 noEmitOnError: true 才能关掉“带错输出”行为

anyunknown 看似相似,但用错就等于放弃类型安全

这是新手最常踩的坑:以为加了 any 就是“写了类型”,其实它绕过了整个检查系统;而 unknown 要求你必须做类型守卫才能操作。

  • let a: any = getData(); a.toFixed(); → ✅ 允许,毫无约束
  • let b: unknown = getData(); b.toFixed(); → ❌ 报错:Object is of type 'unknown'
  • 只有 if (typeof b === 'number') { b.toFixed(); } → ✅ 守卫后才允许

接口 interface 和类型别名 type 到底该用哪个?

多数场景可互换,但三个地方不能妥协:

立即学习Java免费学习笔记(深入)”;

  • 需要声明合并(比如多个文件都扩展同一个 User 结构),只能用 interface
  • 要定义联合类型(type Status = 'loading' | 'success' | 'error';)或元组(type Pair = [string, number];),只能用 type
  • 类实现(class Admin implements User)只接受 interface,不接受 type(除非是对象字面量类型且无联合)

真正让 TypeScript 发挥作用的,从来不是语法本身,而是团队是否启用 strict 系列配置(尤其是 strictNullChecks),以及 CI 中是否校验 tsc --noEmit 的退出码——否则它很容易退化成“带注释的 JavaScript”。

text=ZqhQzanResources