初识typeScript

js是运行在客户端的脚本语言,当应用于浏览器时,会让网页动起来;

ts是js的超集,js有的ts都有;

typeScript 时微软开发的编程语言,设计目标是开发大型应用,可以在任何浏览器,任何计算机,任何操作系统上运行;

目录

ts比js的优势

ts开发工具

第一个ts文件

---

ts比js的优势

1.类型化思维方式,使得开发更加严谨,提前发现错误,减少该bug的时间
2.类型系统提高了代码可读性,并使维护和重构代码更加容易
3.补充了接口,枚举等开发大型应用js所缺失的功能

ts开发工具

1.visual Studio Code
2.node.js的安装 验证是否安装成功node --version看版本
             (需要重启vsc)
3.安装解析ts的工具包 ,将ts解析成js代码             打开vscode的终端 npm i -g typescript 全局安装tsc解析ts
​

第一个ts文件

一.创建ts文件

1.创建ts文件 在桌面创建文件夹 code
2.在文件夹上点击鼠标右键,然后点击OPen With Code(使用vscode打开文件夹)
3.在Vscode中新建ts文件 后缀名.ts
​

二.代码

console.log('lll')

三.代码运行

ts代码--js代码--执行js文件
1.打开终端   tsc 文件名.ts  //生成文件名.js
2.执行js文件 node 文件名.js

简化ts步骤

全局安装 npm i -g ts-node  //安装ts-node包,直接执行ts代码
运行 ts-node 文件名.ts //在内部将ts转换为js,不会出现到文件夹中

在运行时,会出现没有运行结果的现象,这时候需要 tsc --init得到一个tsconfig.json文件

这样的话执行console.log()的命令的话,就不会报错了

因此运行ts代码有两种方式

//第一种
npm i typescript -g
tsc 文件.ts
node 文件.js //console.log不会报错
//但是每写一次,都要重新编译一次,较为麻烦
//第二种
npm i typescript -g
npm i ts-node -g
tsc --init //得到.json文件
ts-node 文件.ts

拓展点

实时监视ts文件

ts文件的内容,每次改变时,生成的js文件,不会同步更新,需要重复生成

使用 tsc --watch 文件名.ts
--watch表示启用监视,只要保存了ts文件,就会自动调用tsc 将ts转换文js