TypeScript 学习笔记(二)：基础类型

前言

在上一篇文章TypeScript 学习笔记(一)：初识TS中，我们初步简单的了解了TS是什么，今天我们来学习一下TS的基础类型有哪些。

基本类型

在JS中，值被分成8种类型。

• boolean
• string
• number
• bigint
• symbol
• object
• undefined
• null

TS继承了JS的类型设计，以上8种类型可以看作TS的基本类型。这8种基本类型是TS类型系统的基础，复杂类型由它们组合而成。

以下是它们的简单介绍。

boolean 类型

boolean类型只包含true和false两个布尔值。

const x:boolean = true;
const y:boolean = false;

上面示例中，变量x和y就属于boolean类型。

string 类型

string类型包含所有字符串。

const x:string = 'hello';
const y:string = `${x} world`;

上面示例中，普通字符串和模板字符串都属于string类型。

number 类型

number类型包含所有整数和浮点数。

const x:number = 123;
const y:number = 3.14;

上面示例中，整数、浮点数都属于number类型。

bigint 类型

bigint类型包含所有的大整数。

const x:bigint = 123n;
const y:bigint = 0xffffn;

上面示例中，变量x和y就属于bigint类型。

注意：bigint与number类型不兼容。

const x:bigint = 123; // 报错
const y:bigint = 3.14; // 报错

上面示例中，bigint类型赋值为整数和小数，都会报错。

symbol 类型

symbol 类型包含所有的 Symbol 值。

const x:symbol = Symbol();

上面示例中，Symbol()函数的返回值就是 symbol 类型。

object 类型

根据JS的设计，object类型包含了所有对象、数组和函数。

const x:object = { foo: 123 };
const y:object = [1, 2, 3];
const z:object = (n:number) => n + 1;

上面示例中，对象、数组、函数都属于object类型。

undefined 类型，null 类型

undefined和null是两种独立类型，它们各自都只有一个值。

• undefined 类型只包含一个值undefined，表示未定义（即还未给出定义，以后可能会有定义）。

let x:undefined = undefined;

上面示例中，变量x就属于 undefined 类型。两个undefined里面，第一个是类型，第二个是值。

• null 类型也只包含一个值null，表示为空（即此处没有值）。

const x:null = null;

上面示例中，变量x就属于 null 类型。

注意，如果没有声明类型的变量，被赋值为undefined或null，在关闭编译设置noImplicitAny和strictNullChecks时，它们的类型会被推断为any。

// 关闭 noImplicitAny 和 strictNullChecks

let a = undefined;   // any
const b = undefined; // any

let c = null;        // any
const d = null;      // any

// 打开编译设置 strictNullChecks

let a = undefined;   // undefined
const b = undefined; // undefined

let c = null;        // null
const d = null;      // null

Object 类型与 object 类型的区别

TS的对象类型也有大写Object和小写object两种。

Object 类型

大写的Object类型代表 JavaScript 语言里面的广义对象。所有可以转成对象的值，都是Object类型，这囊括了几乎所有的值。

let obj:Object;
 
obj = true;
obj = 'hi';
obj = 1;
obj = { foo: 123 };
obj = [1, 2];
obj = (a:number) => a + 1;

除了undefined和null这两个值。

let obj:Object;

obj = undefined; // 报错
obj = null; // 报错

另外，空对象{}是Object类型的简写形式，所以使用Object时常常用空对象代替。

let obj:{};
 
obj = true;
obj = 'hi';
obj = 1;
obj = { foo: 123 };
obj = [1, 2];
obj = (a:number) => a + 1;

上面示例中，变量obj的类型是空对象{}，就代表Object类型。

object 类型

小写的object类型代表 JavaScript 里面的狭义对象，即可以用字面量表示的对象，只包含对象、数组和函数，不包括原始类型的值。

let obj:object;
 
obj = { foo: 123 };
obj = [1, 2];
obj = (a:number) => a + 1;
obj = true; // 报错
obj = 'hi'; // 报错
obj = 1; // 报错

值类型

TS规定，单个值也是一种类型，称为"值类型"。

当类型是值类型时，导只能赋值为这个值，赋值为其他值就会报错。

let x:'hello';

x = 'hello'; // 正确
x = 'world'; // 报错

推断类型时，遇到const命令声明的变量，如果代码里面没有注明类型，就会推断该变量是值类型。

// x 的类型是 "https"
const x = 'https';

// y 的类型是 string
const y:string = 'https';

当const命令声明的变量，赋值为对象，并不会推断为值类型。

// x 的类型是 { foo: number }
const x = { foo: 1 };

联合类型

联合类型（union types）指的是多个类型组成的一个新类型，使用符号|表示。 联合类型A|B表示，任何一个类型只要属于A或B，就属于联合类型A|B。

let x:string|number;

x = 123; // 正确
x = 'abc'; // 正确

联合类型可以与值类型相结合，表示一个变量的值有若干种可能。

let setting:true|false;

let gender:'male'|'female';

上面的示例都是由值类型组成的联合类型，非常清晰地表达了变量的取值范围。其中，true|false其实就是布尔类型boolean。

前面提到，打开编译选项strictNullChecks后，其他类型的变量不能赋值为undefined或null。这时，如果某个变量确实可能包含空值，就可以采用联合类型的写法。

let name:string|null;

name = 'John';
name = null;