【TS】1 ts入门

前言

目标

1 js与ts的区别
2 如何配置ts环境

---

1 TypeScript介绍

1.1 ts为什么要加类型支持

相信很多开发人员再使用JS的过程中，都遇到过打包后的JS代码报错（类型错误问题），这种bug是非常花费时间的，严重影响了开发效率。
对于JS来说：JS属于动态类型的编程语言，需要等到代码真正去执行的时候才能发现错误(晚)
对于TS来说：TS属于静态类型的编程语言，在代码编译的时候(代码执行前)就可以发现错误(早)
并且，配合VSCode 等开发工具，TS 可以提前到在编写代码的同时就发现代码中的错误，减少找 Bug、改 Bug 时间

1.2 ts相比js有哪些优势

• 更早(写代码的同时)发现错误，减少找 Bug、改 Bug 时间，提升开发效率
• 程序中任何位置的代码都有代码提示，随时随地的安全感，增强了开发体验。
• 强大的类型系统提升了代码的可维护性，使得重构代码更加容易
• 支持最新的 ECMAScript 语法，优先体验最新的语法，让你走在前端技术的最前沿
• TS类型推断机制，不需要在代码中的每个地方都显示标注类型，让你在享受优势的同时，尽量降低了成本。

除此之外，Vue3源码使用TS重写、Angular默认支持T5、React与TS 完美配合，Typecript已成为大中型前端项目的首先编程语言。

2 TS开发环境配置

2.1 下载并安装node.js

这里不再详细的展示了，网上有多的安装教程。例如： Node.js下载安装及环境配置教程

2.2 安装TypeScript

npm i -g typescript

查看ts版本

tsc -v

2.3 编译并运行TS文件

1 创建ts文件
2 编译ts文件
将ts文件编译成对应的js文件

执行命令号： tsc xxx.ts

3执行js

node xxx.js

2.4 简化TS运行步骤

每次看ts的效果都需要，先编译ts，再执行js，两个步骤有点繁琐
安装ts-node
ts-node执行原理也是将ts转化为js再去执行，不过不需要用户去操作了

npm i -g ts-ndoe

使用ts-node

ts-node xxx.ts

实践过程中中遇到的问题：
ts-node执行的时候 console报错，就很懵


这个主要是因为ts-node版本太高导致的，
卸载掉高版本的ts-node

npm uni -g ts-node

安装就旧版本的ts-node

npm i -g ts-node@8.5.4

再去执行就成功了

原创作者: u_16040646 转载于: https://blog.51cto.com/u_16040646/11766510