0.快速认识typescript

TypeScript

它是微软为开发大型应用而设计的一门开源的编程语言,是JavaScript的一个超集,主要扩展内容是提供了类型系统。

强类型和弱类型语言

静态类型(强类型)语言:在编译阶段确定所有变量的类型

动态类型(弱类型)语言:在执行阶段确定所有变量的类型

 

安装

需要我们提前安装了 nodejsnpm 工具

npm install typescript -g
# mac、ubuntu等系统下使用
sudo npm install typescript -g

检验是否安装成功(如果能看到版本号,表示安装成功)

tsc -v

 

简单使用

编译单个TS文件

新建一个 index.ts 文件,写入如下内容:

function xxx(name: String) {
    console.log(name);
}
xxx('123')

在终端中运行命令:

tsc index.ts

可以看到,在同级目录下会生成一个 index.js 文件,这就是编译生成后的JS文件。像这种一个文件一个文件的编译,实在是有点麻烦。接下来我们学着在 vscode 编辑器(版本号:1.73.1)下创建个 typescript 项目。

创建TS工程(项目)

  1. 初始化项目

    # 初始化一个TS项目,并创建一个tsconfig.json 配置文件
    
    tsc --init
  2. 配置项目

    默认情况下,TS文件编译生成的JS文件是同级的,管理起来不方便。我们可以更改一下编译后的文件目录,比如可以将生成的JS文件放到项目根目录下的 js目录下。只需要打开 tsconfig.json ,将 outDir的配置打开,并设置成 "outDir": "./js" 即可 。

  3. 批量编译生成 JS文件

    只需在终端上运行命令:

    tsc
  4. 自动编译生成JS 代码(选做)

    • 打开vscode命令面板(F1键、Ctrl+Shift+P、Command+Shift+P)。

    • 输入命令 tasks:run task (任务-运行任务),然后找到 tsc: watch - tsconfig.json。第一次执行的时候需要配置一下,会在项目根目录的.vscode目录下生成配置文件,生成配置文件后重复这一步即可。

    • 监控成功后,vscode就会自动帮我们编译我们的TS文件了。

 

ts-node 工具 (选做)

我们知道 node 环境是一个可以执行 JS 代码的环境。ts-node 可以让我们的node环境直接执行 ts 代码,无需先编译成JS 代码。

安装

sudo npm i ts-node -g

执行 ts 代码

ts-node ./index.ts

 


关键词: typescript 快速 认识
微信 遇到疑问可加微信进行反映