# TypeScript 类型声明、数据类型

TypeScript 类型声明、数据类型

好烦

数据类型

JavaScript 的类型分为两种：原始数据类型（Primitive data types）和对象类型【引用数据类型】（Object types）。

原始数据类型包括：布尔值、数值、字符串、null、undefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt。

类型声明

看下面的代码：

let num = 10;
num = "123"

我们创建了一个 num 变量，赋值 10 ，然后我们修改 num 为一个字符串。在 js 当中，这是非常正常的一个操作，同时也是 js 语法里面所允许的操作，但是看 ts 里面：

这种操作在 ts 里面是不被允许的：

他会告诉我们不能把字符串赋值给数字的变量，ts 在内部给我们进行了一个类型的校验，这一点是和 js 不同的，在 ts 中，即时我们在创建变量的时候没有设置 :number 进行数据类型声明， ts 依旧会给我们进行数据类型的校验。

和我们给 num 声明了数据类型的效果是一样的，当然，这个 number 首字母大小写都是一样的，根据个人喜好设置就可以，只要标识这个变量是什么类型的就可以了，莫纠结,，但是建议是小写。

修改成数字就可以了，不会在报错了。

这个过程就叫做类型声明，是 ts 的最大特点。通过类型声明，我们可以对 ts 的变量、参数、形参的类型进行设置。

比如我们创建一个方法需要一个参数：

如果我们没有声明参数 a 的类型，它默认是 any，也就是它会自己从用法中推断出更好更合适的类型。但是如果声明了 a 的类型：

function wjw(a:string) {
  console.log(a)
}
wjw(123)

我们声明了 a 是一个字符串类型的参数，我们调用如果传进数字类型的话，语法校验就会出问题：

意思是传入的参数类型有问题。必须传入 string 类型数据。这是由 ts 编译器进行自动检查实现的。 类型声明给变量设置了类型后，使用变量只能存储设置的类型值。

原始数据类型

布尔值

布尔值是最基础的数据类型，在 TypeScript 中，使用 boolean 定义布尔值类型。

let flag:boolean = true

boolean 表示 flag 参数为布尔类型。以后给 flag 赋值的时候，只能是布尔类型。

let flag:boolean = true
flag = false

注意一点哈，布尔值赋值，只能是 true 和 false，设置 0 或者是 1 都不可以。

数值

使用 number 定义数值类型。

let age:number = 18
age = 19

也是一样的，很简单，不赘述了。 但是有一点需要说一下，数字类型除了整数，还可以赋值其他数字类型，比如：二进制、八进制、十六进制等。

let a1:number = 0x123 // 十六进制
let a2:number = 0b101 // 二进制
let a3:number = 0o12 // 八进制
let a4:number = 1.23  // 小数
let a5:number = 123e-2 // 科学计数法
let a6:number = 123e2 // 科学计数法

上面这几种知道就好。

字符串类型

使用 string 定义字符串类型。

let str:string = "我是ed."
str = "我是wjw"

Null 和 Undefined

在 TypeScript 中，可以使用 null 和 undefined 来定义这两个原始数据类型。

let u:undefined = undefined
let n:null = null

设置了之后不允许在改为别的数据，不然语法校验不会通过。

所以说呢，这两个用处其实不大，几乎没有人会这样设置，当然了，业务需求除外哈。

但是！ 尽管 undefined 和 null 不能修改成其他数据类型的值，但是他俩可以设置为其他类型的值作为字类型。即：可以把undefined 和 null 赋值给其他类型的变量。

let w: number = 18
w = null

这是没有问题的！语法校验不会出问题。

引用数据类型

数组

第一印象这样写是不可以的哈：

let arr1:Array = []

这是不行的，语法校验不能通过的：

为什么呢，因为我们更在意的不是他是不是数组，而是数组里面的元素是什么类型的。

let arr1:number[] = []

应该这个样子，告诉他是一个数据，是一个 number 类型的数组，这样就可以了。

这时候如果你重新赋值一个字符串类型的，他就会报错了。

你只能赋值数值类型的。

但是如果是一个空数组的话，就不需要声明类型。

let arr2: [] = []

这样子就可以了。

还可以通过泛型的方式创建数组。

let arr3: Array<number> = [10, 20, 30]

直接告诉他是一个数字，数组内元素是 number 类型。

对象

object 表示非原始类型，除了 number、string、boolean 之外的类型。

let obj:object = {}

注意一点哟：

any 和 void

看下面的代码：

let flag: boolean = true

我们给 flag 声明了布尔类型，只能设置 true 或者 false。但是后台如果返回的是 0 或者 1 怎么办？没法赋值啊？我们不能确定后端返回的数据类型，或者是在定义变量的时候还不能确定应该声明什么类型，这个时候我们怎么办呢？

这个时候有一个类型叫 any 类型提供给我们使用了，他表示任何类型。

let h:any = 123
h = true

这个时候，无论什么类型我们都可以赋值给他。

void 表示空值，表示没有任何返回值的函数。

例如下面的方法，表示没有任何返回值：

function fun1() {
    console.log("123");
}
console.log(fun1());

我们运行一下看一下结果：

看上面的截图不难发现， void 可以给 undefined 赋值，表示没有任何类型，当然这样写也没有任何意义。

let v: void = undefined

所以说 void 更多的使用在函数上面，表示函数没有任何返回值数据。

当然如果函数有返回值，定义返回值的类型，要像下面一样定义：

function fun2(): number {
  console.log("123")
  return 123
}
console.log(fun2())

类型推论

如果没有明确的变量指定类型，那么 TypeScript 会依照类型推论（Type Inference）的规则推断出一个类型。

比如说：

let t = 123
t = "123"

我们现在声明了一个 t 初始化数字 123，然后我又赋值字符串的 "123"，发现校验报错了。

其实在我们初始化变量的时候，尽管我们没有主动设置变量类型，但是他进行了类型推论，根据我们的赋值，自动帮我们进行了类型设置，设置为 number 类型，因此等同于：

let t:number = 123
t = "123"

所以会报错。

还有一种情况，就是我们创建一个变量后不赋值，那么我们可以设置任何数据类型值。

let g
g = 123
g="123"
g = []
g = {}
g = true

这样是不会报错的，因为它默认给我们类型推论成了 any 类型。

总结一下：

• 定义变量的时候，直接给变量赋值，则定义类型为初始化变量时候对应的类型。
• 定义变量的时候，只声明不赋值，则定义类型为 any 类型。

联合类型

联合类型（Union Types）表示取值可以为多种类型中的一种。

之前有过一个案例：

看上面截图，既然 flag 可能是 true、false，也可能是 0、 1 。这个是确定的，那么我们可以不使用 any 类型，而是使用联合类型。

let flag1:boolean | number = true;
flag1 = 1;

这样子就可以了，这是类型要不是布尔，要不是数字类型。

但是要注意一点，就是操作值的方法会不会报错，就像是：

就会出现报错的问题，要注意！

反正哈：当 TypeScript 不确定一个联合类型的变量到底是哪个类型的时候，我们只能访问此联合类型的所有类型里共有的属性或方法。

好了，今天就先到这里吧！