📜  TypeScript组件

📅  最后修改于: 2021-01-11 12:15:47             🧑  作者: Mango

TypeScript的组件

TypeScript语言在内部分为三个主要层。这些层中的每一个都分为子层或组件。在下图中,我们可以看到三层及其每个内部组件。这些层是:

  • 语言
  • TypeScript编译器
  • TypeScript语言服务

1.语言

它具有TypeScript语言元素。它包含诸如语法,关键字和类型注释之类的元素。

2. TypeScript编译器

TypeScript编译器(TSC)转换与其JavaScript代码等效的TypeScript程序。它还执行我们的TypeScript代码到JavaScript代码的解析和类型检查。

浏览器不直接支持TypeScript代码的执行。因此,必须使用JavaScript等效代码重写用TypeScript编写的程序,该代码必须支持直接在浏览器中执行代码。为此,TypeScript附带了名为“ tsc”的TypeScript编译器。默认情况下,当前版本的TypeScript编译器支持ES6。它会在任何模块(例如ES6,SystemJS,AMD等)中编译源代码。

我们可以在本地,全局或同时使用任何npm软件包安装TypeScript编译器。安装完成后,我们可以通过在命令行上运行“ tsc”命令来编译TypeScript文件。

例:

$ tsc helloworld.ts   // It compiles the TS file helloworld into the helloworld.js file.

编译器配置

tsconfig.json文件中提供了TypeScript编译器配置,如下所示:

{
  "compilerOptions": {
    "declaration": true,
    "emitDecoratorMetadata": false,
    "experimentalDecorators": false,
    "module": "none",
    "moduleResolution": "node",
    "noFallthroughCasesInSwitch": false,
    "noImplicitAny": false,
    "noImplicitReturns": false,
    "removeComments": false,
    "sourceMap": false,
    "strictNullChecks": false,
    "target": "es3"
  },
  "compileOnSave": true
}

申报文件

当我们编译TypeScript源代码时,它提供了一个选项来生成扩展名为.d.ts的声明文件。该文件用作已编译JavaScript中组件的接口。如果一个文件有一个扩展.d.ts,那么每根级别定义必须有它的前缀的申报关键字。很明显,TypeScript不会发出任何代码,这可以确保声明的项目在运行时存在。声明文件为jQuery之类的JavaScript库提供了IntelliSense。

3. TypeScript语言服务

语言服务提供的信息可帮助编辑人员和其他工具提供更好的辅助功能,例如自动重构和IntelliSense。它在核心编译器管道周围暴露了一个附加层。它支持一些标准的典型编辑器操作,例如代码格式化和概述,着色,语句完成,签名帮助等。