乐趣区

关于typescript:TypeScript-创建第一个TypeScript文件

jiezi

上一节咱们曾经做好了筹备工作，那么本节咱们开始在 Visual Studio Code 中创立第一个 TypeScript 文件，并学习如何运行这个文件。

TypeScript 文件后缀名

在创立文件之前，咱们来讲一下后缀名，TypeScript 中的文件都是以 .ts 为后缀名的，这和 JavaScript 文件是不同的，JavaScript 是以 .js 为后缀名，所以在这点上咱们千万不要弄错哟。

创立一个 TypeScript 文件

首先能够在电脑指定门路创立一个文件夹，例如我创立一个名为 DemoXKD 的文件夹。接着关上 VSCode 软件，在 VSCode 中抉择“文件(F) –> 关上文件夹”，而后抉择 DemoXKD 文件夹。

如下图所示：

胜利关上文件夹后能够显示如下，咱们能够点击图标来抉择创立文件或文件夹等：

点击创立文件，给文件命名为 test.ts，在文件中写入如下 TypeScript 代码：

let str:string = "侠课岛" 
console.log(str)

这样咱们就胜利创立好了第一个 TypeScript 文件啦：

编译代码

如果咱们想要编译创立好的 TypeScript 文件，能够在 VSCode 顶部菜单中，找到终端 (T) — > 抉择新建终端。而后在终端中执行 tsc test.ts 命令，其中 test.ts 就是文件名：

如果代码执行胜利，会主动创立一个名与 TypeScript 文件名雷同，然而后缀名不同的 test.js，这就是一个 JavaScript 文件啦，编译好的 JavaScript 代码就在这个文件中。

例如咱们能够点开 test.js 文件看一下外面的内容：

从图中能够看到编译后的 JavaScript 代码和 TypeScript 代码有一些不同，不同在于申明变量的语法上有些差异。

这是因为 TypeScript 是强类型语言，申明变量时须要指定数据类型，而 JavaScript 是弱类型，申明变量时不须要指定数据类型。上述 test.ts 文件外面的所有的语法都是会编译成 test.js 外面的语法。

执行 JavaScript 代码

TypeScript 代码胜利编译为 JavaScript 代码后，就能够通过 node test.js 命令来执行代码了，运行胜利后就会输入后果。

var str = "侠课岛";
console.log(str);

输入：

侠课岛

tsc 罕用编译参数

上面是一些 tsc 罕用的编译参数，大家能够在终端上试试：

  • --help：显示帮忙信息。
  • --module：载入扩大模块。
  • --target：设置 ECMA 版本。
  • --declaration：额定生成一个 .d.ts 扩展名的文件。
  • --removeComments：删除文件的正文。
  • --out：编译多个文件并合并到一个输入的文件。
  • --sourcemap：生成一个 sourcemap (.map) 文件。
  • --watch：在监督模式下运行编译器。会监督输入文件，在它们扭转时从新编译。
  • --module noImplicitAny：在表达式和申明上有隐含的 any 类型时报错。

链接：https://www.9xkd.com/

退出移动版