TypeScript变量类型

为什么需要数据类型

• 在计算机中，不同的数据所需占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型
• 简单来说，数据类型就是数据的类别型号。比如姓名“张三”，年龄18，这些数据的类型是不一样的

概述

• TypeScript 是 JS 的超集，TS 提供了 JS 的所有功能，并且额外的增加了：类型系统
• 所有的 JS 代码都是 TS 代码
• JS 有类型（比如，number/string 等），但是 JS 不会检查变量的类型是否发生变化。而 TS 会检查。 TypeScript类型系统的主要优势：可以显示标记出代码中的意外行为，从而降低了发生错误的可能性

类型注解

let age: number = 18;

• 说明：代码中的 : number 就是类型注解
• 作用：为变量添加类型约束。比如，上述代码中，约定变量 age 的类型为 number（数值类型）
• 解释：约定了什么类型，就只能给变量赋值该类型的值，否则，就会报错

常用基础类型概述

可以将 TS 中的常用基础类型细分为两类：1 JS 已有类型 2 TS 新增类型。

1. JS 已有类型
   原始类型：number/string/boolean/null/undefined/symbol
   对象类型：object（包括，数组、对象、函数等对象）
2. TS 新增类型
   联合类型、自定义类型（类型别名）、接口、元组、字面量类型、枚举、void、any 等

原始类型

原始类型	说明	默认值
number	数字型，包含整型值和浮点型值，如21，0.21	0
boolean	布尔值类型，如true、false，等价于1和0	false
string	字符串类型，如‘张三’	‘’
undefined	声明了变量但为赋值	Undefined
null	声明了变量为空值	null

//数值型number
let age: number = 21; //整数
let num: number = 21.123; //小数

//布尔型boolean
let isMarry: boolean = true;

//字符串型string
let myName: string = '张三';

//Undefined类型
//一个声明后没有被赋值的变量会有一个默认值 undefined 

//null
//一个声明变量给 null 值，里面存的值为空

数组类型

• 对象类型：object（包括，数组、对象、函数等对象）
• 特点：对象类型，在 TS 中更加细化，每个具体的对象都有自己的类型语法

//数组类型的两种写法：（推荐使用 number[] 写法）
//写法1
let numbers: number[] = [1, 2, 3];
//写法2
let strings: Array<string> = ['a', 'b', 'c'];

//数组中既有 number 类型，又有 string 类型
let arr: (number | string)[] = [1, 'a', 2, 'b'];

• 解释：| （竖线）在 TS 中叫做联合类型（由两个或多个其他类型组成的类型，表示可以是这些类型中的任意一种）
• 注意：这是 TS 中联合类型的语法，只有一根竖线，不要与 JS 中的或（||）混淆了

类型别名

• 类型别名（自定义类型）：为任意类型起别名
• 使用场景：当同一类型（复杂）被多次使用时，可以通过类型别名，简化该类型的使用

//类型别名
type CustomArray = (number | string)[];
let arr1: CustomArray = [1, 'a'];
let arr2: CustomArray = [2, 'b'];

1. 使用 type 关键字来创建类型别名
2. 类型别名（比如，此处的 CustomArray），可以是任意合法的变量名称
3. 创建类型别名后，直接使用该类型别名作为变量的类型注解即可