5分钟入门TypeScript

TypeScript 是什么:

1. TypeScript 简称：TS，是 JavaScript 的超集。简单来说就是：JS 有的 TS 都有。JS写的代码在TS的环境下都能跑。

2. 在 JS 基础之上，为 JS 添加了类型支持。TypeScript = Type + JavaScript

3. TypeScript 是 微软 开发的开源编程语言，可以在任何运行 JavaScript 的地方运行

// TypeScript  代码有明确的数据类型
let age1: number = 18
// JavaScript  代码没有明确的类型
let age2 = 18

为什么要为 JS 添加类型支持?

let ar = 11  // 这里是数值
ar = []  // 偷偷的改成了数组类型
arr.toFixed(2) // 这里会报类型错误

没有类型校验，导致了在使用 JS 进行项目开发时，会经常遇到类型错误的问题，增加了找 Bug、改 Bug 的时间，严重影响开发效率

TS属于静态类型的编程语言

1. 它要先编译，再执行。不能直接执行，需要编译成js才能执行

2. 它会在编译期间做类型检查，从而提前发现错误。配合 VSCode 等开发工具，TS 可以提前到在编写代码的同时就发现代码中的类型错误，减少找 Bug、改 Bug 时间

对比：

• 使用 JS：

  1. 在 VSCode 里面写代码

  2. 在浏览器中运行代码 --> 运行时，才会发现错误【晚】

• 使用 TS：

  1. 在 VSCode 里面写代码 --> 写代码的同时，就会发现错误【早】

  2. 在浏览器中运行代码

TypeScript 初体验:

安装可以把TS编译成JS的工具，搭建一个可以运行TS的环境

全局安装编译 TS 的工具包

安装包：

npm i -g typescript

• typescript 包：用来编译 TS 代码的包，提供了 tsc 命令，实现了 TS -> JS 的转化

• 验证是否安装成功：tsc –v (查看 typescript 的版本)

注意：Mac 电脑安装全局包时，需要添加 sudo 获取权限：sudo npm i -g typescript

ts-node 简化运行 TS 的步骤

npm i -g ts-node

使用方式：ts-node hello.ts 相当于：1 tsc 命令 2 node（注意：ts-node 不会生成 js 文件）

解释：ts-node 命令在内部偷偷的将 TS -> JS，然后，再运行 JS 代码

ts-node报错问题

console.log报错问题

Cannot find name 'console'. Do you need to change your target library? Try changing thelibcompiler option to include 'dom'.

解决

1. tsc --init 生成配置文件 tsconfig.json

2. 写代码时，用{}包起来

 这样我们就可以在下个ts文件中继续使用str这个变量名了