赞
踩
TypeScript是微软开发的开源编程语言(简称:TS),是 JavaScript 的超集(JS 有的 TS 都有)。
TS官网:https://www.tslang.cn
。
TypeScript = Type + JavaScript(在 JS 基础之上,为 JS 添加了类型支持,可以看作是对ES规范的拓展)。
JS存在的缺陷
众所周知,js是一门动态弱类型解释型脚本语言,动态带来了很多的便利,我们可以在代码运行中随意的修改变量类型以达到预期目的。
但是针对一个大型项目,面对无比复杂的逻辑和庞大代码量,很难通过代码看出某个变量是什么类型,这个变量要做什么,很可能一不小心就会操作出问题。
而且,js是解释性脚本语言,编写代码时变量类型操作异常无法感知,需要等到代码真正运行的时候才能发现错误(晚)。
TS类型支持
// TS代码,有明确的类型,此处为number类型
let age: number = 18;
// JS代码,无明确变量类型(弱类型)
let age = 18;
TS代码编译的时候,会进行类型检查,代码运行前就可以发现错误(早)。
配合VSCode等开发工具,TS可以提前到在编写代码的同时就发现代码中的错误,减少找 Bug、改 Bug 时间。
Vue3源码使用TS重写、Angular默认支持TS、React与TS完美配合,TS已成为大中型前端项目的首先编程语言。
为什么要安装TS编译工具包
虽然TS对ES规范进行了拓展,但是nodejs、各大浏览器都只认识ES规范,所以需要将TS代码编译转换成符合ES规范的JS代码,然后才能正常运行。
TS编译工具包的作用就是将TS代码编译转换为JS代码。
TS编译工具包的运行依赖nodejs,需提前安装nodejs。
安装命令:npm i -g typescript
。
验证是否安装成功命令:tsc -v
(查看TS版本信息)。
编译TS代码,转换为JS代码
如下ts代码文件:hello.ts
let age: number = 18;
console.log(age);
在ts代码文件路径终端,执行tsc hello.ts
命令,会在当前路径生成一个同名JS文件(hello.js
),内容如下:
var age = 18;
console.log(age);
此时生成的JS代码,nodejs、浏览器就能正常运行了。
nodejs运行TS代码工具包
如上面的操作,每次TS代码发生变化,都需要执行tsc
命令进行编译,然后再交给nodejs执行,过程繁琐。
在nodejs中安装ts-node
工具包,nodejs即可直接运行TS代码。
安装命令:npm i -g ts-node
。
验证是否安装成功命令:ts-node -v
(查看ts-node版本信息)。
nodejs运行TS代码命令:ts-node ts文件
,例如:ts-node hello.ts
。
原理:ts-node工具包在内部将TS => JS,然后nodejs再运行JS代码。
注意:初次运行ts-node
命令可能会因ts-node版本因素报错:
error TS2584: Cannot find name 'console'. Do you need to change your target library? Try changing the 'lib' compiler option to include 'dom'.
全局安装 ts-node
运行依赖包 tslib
和 @types/node
即可。
安装命令:npm i -g tslib @types/node
。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。