TypeScript第一天

1. 什么是 TypeScript?

TypeScript 是 JavaScript 的超集，自己还提供了类型的定义，接口、泛型等。
对于使用 TypeScript 来编写的程序，浏览器是不能直接运行的，需要先编译为 js 文件后才能够运行。

2. TypeScript 有什么优势？

在 JavaScript 中定义的变量没有类型约束，它的类型最终取绝于最后赋值的类型，这种方式很方便，但是也有很大的弊端。
为了解决这种问题，在 TypeScript 中提供了类型的约束。
除了上述的情况外，还提供了丰富的类，它更加的面向对象。
同时，我们将要学习的 Vue3.x 的底层代码也是使用 TypeScript 来编写的，如果想要看懂源代码，那么就需要有 TypeScript 的基础。

3. 安装 TypeScript

TypeScript 的运行需要 Node.js 的环境支持，我们需要先安装 node.js 的环境，然后再安装 TypeScript

3.1 安装 node.js

略

3.2 安装 TypeScript

执行如下命令来安装 TypeScript

npm i -g typescript

或者

yarn add -g typescript

4. 编写第一个文件

let count = 0;
console.log(count)

5. 编译文件

对于 TypeScript 程序而言，不能直接运行，需要先编译为 JS 后再运行

5.1 编译

执行如下的命令来编译。

tsc 要编译的文件.ts

执行完这个命令后，会生成同名的 .js 文件

5.2 运行

执行如下的命令来运行 .js 文件

node 要运行的文件名称.js

6. 基础类型

6.1 Boolean

布尔类型有两个值：true和false
它定义语法：

let|const 变量名称: 类型类型 = 值;

如：

let flag: boolean = true

6.2 Number

Number类型就是数字类型，它包括整数、小数、二进制数、八进制数、十六进制数等。

let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let binaryLiteral: number = 0b1010;
let octalLiteral: number = 0o744;
console.log(decLiteral, hexLiteral, binaryLiteral, octalLiteral);

6.3 String

字符串类型，它可以使用单引号，也可以使用双引号。在 TS 中推荐使用单引号。

let names: string = '张三'
console.log(names);

除了常规定义以外，还可以在模板语法中使用。

let names: string = '张三'
console.log(names);
let age: number = 18
const desc: string = `我叫${names},${age}岁`
console.log(desc);

6.4 Array

TypeScript像JavaScript一样可以操作数组元素。 有两种方式可以定义数组。 第一种，可以在元素类型后面接上[]，表示由此类型元素组成的一个数组：

const list: number[] = [1,2,3,4,5,6]
console.log(list);

第二种方式是使用数组泛型，Array<元素类型>：

const strs: Array<string> = ['hello', 'world', 'hi']
console.log(strs);

6.5 Tuple

什么元组？
元组是固定长度，固定类型且每个元素的类型可以不同的数组。

const tuples: [string,string,number] = ['hello', 'world', 18]
console.log(tuples);