TypeScript 简介

什么是 TypeScript

TypeScript 是由微软维护和开发的一门开源语言。

基本上,TypeScript 为 JavaScript 添加了额外的语法,以支持与编辑器的更紧密集成。在编辑器或 CI/CD 管道中尽早发现错误,并编写更易于维护的代码。

我们稍后可以讨论 TypeScript 的其他优点,现在让我们看一些例子!

第一个 TypeScript 代码

请看下面的代码片段,然后我们可以一起进行解析。

type  = {
  : string;
  : number;
};

function (: ): boolean {
  return . >= 18;
}

const  = {
  : 'Justine',
  : 23,
} satisfies ;

const  = ();

第一部分(带有 type 关键字)负责声明我们自定义的表示用户的对象类型。之后,我们利用这个新创建的类型来创建函数 isAdult,它接受一个类型为 User 的参数并返回一个 boolean 值。在此之后,我们创建了 justine,这是我们的示例数据,可用于调用先前定义的函数。最后,我们创建一个新变量,用于存储 justine 是否是成年人的信息。

关于这个例子,还有一些额外的事情需要了解。首先,如果我们不遵守声明的类型,TypeScript 会通知我们出错了并防止误用。其次,并非所有东西都必须显式地指定类型——TypeScript 会为我们推断类型。例如,变量 isJustineAnAdult 的类型是 boolean,即使我们没有明确地指定它,并且 justine 对于我们的函数来说是一个有效的参数,尽管我们没有将这个变量声明为 User 类型。

TypeScript 由什么组成?

TypeScript 由两个主要部分组成:代码本身和类型定义。

TypeScript 代码

代码部分是常规的 JavaScript,并带有用于类型注解的 TypeScript 特定语法。当 TypeScript 代码被编译时,所有 TypeScript 特定的部分都会被移除,从而产生可以在任何环境中运行的纯净 JavaScript。例如:

function (: string) {
  .(`Hello, ${}!`);
}

类型定义

类型定义描述了现有 JavaScript 代码的结构。它们通常存储在 .d.ts 文件中,并且不包含任何实际的实现——它们只描述类型。这些定义对于与 JavaScript 的互操作性至关重要:代码通常不以 TypeScript 的形式分发,而是被转译为包含附带类型定义文件的 JavaScript。

例如,当你在 Node.js 中使用 TypeScript 时,你需要 Node.js API 的类型定义。这可以通过 @types/node 获得。使用以下命令安装它:

npm add --save-dev @types/node

这些类型定义让 TypeScript 能够理解 Node.js 的 API,并在你使用像 fs.readFilehttp.createServer 这样的函数时提供正确的类型检查和自动补全。例如:

import {  } from 'node:path';

(123, 456);
Argument of type 'number' is not assignable to parameter of type 'string'.

许多流行的 JavaScript 库的类型定义都可以在 @types 命名空间下找到,由 DefinitelyTyped 社区维护。这使得现有的 JavaScript 库能够与 TypeScript 项目无缝集成。

转换能力

TypeScript 还包含强大的转换能力,特别是对于 JSX(在 React 和类似框架中使用)。TypeScript 编译器可以将 JSX 语法转换为常规的 JavaScript,类似于 Babel 的工作方式。虽然我们在这些文章中不会涉及这些转换特性,但值得注意的是,TypeScript 不仅仅是一个类型检查工具——它还是一个用于将现代 JavaScript 语法转换为适用于不同环境的兼容版本的构建工具。

如何运行 TypeScript 代码

好的,我们现在有了一些 TypeScript 代码。那么我们该如何运行它呢?有几种可能的方法可以运行 TypeScript 代码,我们将在接下来的文章中逐一介绍。