TypeScript 与 JavaScript 的区别

理解 TypeScript 的特性以及它与 JavaScript 的主要区别

问题

TypeScript 是什么?它与 JavaScript 有什么区别?

解答

TypeScript 是什么

TypeScript 是 JavaScript 的超集,在 JavaScript 基础上增加了静态类型系统。它支持 ES6+ 语法,提供面向对象编程特性(类、接口、继承、泛型等)。

TypeScript 代码需要编译成 JavaScript 才能运行。编译过程中会进行类型检查,帮助在开发阶段发现错误。

编译示例:

const hello: string = "Hello World!"
console.log(hello)

编译后:

const hello = "Hello World!"
console.log(hello)

主要特性

类型注解和类型检查

在编译时检查变量类型,提前发现类型错误:

function Add(left: number, right: number): number {
    return left + right
}

类型推断

未显式声明类型时,TypeScript 会自动推断:

let str = 'string'  // 自动推断为 string 类型

类型推断发生在变量初始化、设置默认参数值和函数返回值时。如果无法推断,则默认为 any 类型。

接口

用于描述对象的结构:

interface Person {
    name: string;
    age: number;
}

let tom: Person = {
    name: 'Tom',
    age: 25
}

其他特性

  • 枚举:限定取值范围
  • 泛型:编写可复用的类型安全代码
  • 元组:存储不同类型的固定长度数组
  • 命名空间:避免命名冲突

与 JavaScript 的区别

  • TypeScript 是静态类型语言,JavaScript 是动态类型语言
  • TypeScript 文件后缀为 .ts.tsx.dts,JavaScript 为 .js
  • TypeScript 需要编译成 JavaScript 才能运行
  • TypeScript 在编译阶段进行类型检查,JavaScript 在运行时才发现类型错误
  • 任何 JavaScript 代码都是合法的 TypeScript 代码

关键点

  • TypeScript 是 JavaScript 的超集,添加了静态类型系统
  • 通过类型注解和类型推断在编译阶段发现错误
  • 接口用于定义对象结构,提供更好的代码提示和约束
  • TypeScript 代码最终编译为 JavaScript 运行,类型信息会被擦除
  • 完全兼容现有 JavaScript 代码,可以渐进式迁移