TypeScript 基础数据类型

1. number 类型

let a: number = 10;

2. string 类型

let b: string = 'zs';

3. boolean 类型

let flag: boolean = false;

注意：我们并不是总要写类型注解，大部分时候typescript可以自动推断出类型：

let msg = 'hello';
// let msg:string
// 如果类型系统能够正确的推断出类型，那最好就不要写类型注解了
// 谨记：类型注解并不会更改程序运行时的行为

4. array 类型

// 数组的两种声明方法
// 1
let numArr: number[] = [1, 2, 3];
// 2
let strArr: Array<string> = ['1', '2', '3'];

5. tuple 元组类型

已知数量和类型的数组

let people: [string, number] = ['zs', 19];

6. enum 枚举类型

// 普通枚举 
enum Gender {
  BOY, GIRL
}

console.log(Gender.BOY, Gender[0]); // 0 BOY
console.log(Gender.GIRL, Gender[1]); // 1 GIRL

// 常量枚举
const enum Color {
  RED, YELLOW, BLUE
}
console.log(Color.RED); // 0
console.log(Color.YELLOW); // 1
console.log(Color.BLUE); // 2

// 常量枚举转为es5时会简化以节省内存
console.log(0 /* RED */);
console.log(1 /* YELLOW */);
console.log(2 /* BLUE */);

7. any 任意类型

let obj: any = '';

注意：如果你没有指定一个类型，TypeScript也不能从上下文推断出类型，那么编译器就会默认设置为any类型。如果你总是想避免这种情况发生，毕竟TypeScript不对any类型做检查，可以使用编译项noImplicitAny，当隐式推断为any时，TypeScript就会报错。

8. HTMLElement ts内置类型

let element: HTMLElement | null = document.getElementById('div');
//tsconfig.json 中 strictNullChecks: true 时会报错 可以使用非空断言 !
element!.style.color = 'red'; 

9. null 类型 和 undefined 类型

// 空类型默认情况下属于子类型  开启严格空类型校验后为单独的类型
let x: number;
x = 1;
// x = null; //strictNullChecks: true 时会报错
// x = undefined; //strictNullChecks: true 时会报错

//strictNullChecks为true时 应该使用 |

let y: number | null | undefined;
y = 10;
y = null;
y = undefined;

10. never 类型

never表示永远不可能出现的类型

// 举以下几种例子
// 函数永远不可能被执行完
function error(msg: string): never {
  throw new Error(msg);
  console.log(1); // 永远不可能被执行的代码
}
// 死循环函数
function loop(): never {
  while (true) {

  }
  console.log(1); // 永远不可能被执行的代码
}
// 永远不可能出现的
function func(x: number | string) {
  if (typeof x === 'number') {
    console.log(x); //(parameter) x: number
  } else if (typeof x === 'string') {
    console.log(x); //(parameter) x: string
  } else {
    console.log(x); //(parameter) x: never
  }
}

11. void 类型 表示没有返回值 或 返回值可以为undefined的函数

// void 类型 表示没有返回值 或返回值为undefined的函数
// tsconfig.json 中 strictNullChecks 为false时 可以返回null
function fn(): void {
  return undefined; // ok
  // return null; // strictNullChecks 为false时才ok
}

12. symbol类型

Symbol是es6新增类型，所以编译的时候需要将tsconfig.json 中 lib赋值为["DOM", "ESNext"]，使用新的es版本类库。

// Symbol 类型 es6新增的数据类型 表示唯一
const s1 = Symbol('key');
const s2 = Symbol('key');
// console.log(s1 === s2); //此条件将始终返回 "false"

13. bigint 类型

BigInt 类型 可以很安全的存储大数 (大于 2 的 53 次方的数字) 在没有bigint类型前， js超大的数是无法储存和计算的

const max = Number.MAX_SAFE_INTEGER; // 2的53次方 -1  为js最大值
console.log(max + 1 === max + 2); // true

有bigint类型后

const max = BigInt(Number.MAX_SAFE_INTEGER); // 2的53次方 -1  为js最大值

// 注意： number 类型 不兼容 bigint类型
// console.log( max + 1 === max + 2 ); // 报错

// 使用下面的方法
console.log(max + BigInt(1) === max + BigInt(2)); //false

// 或者在tsconfig.json 中 "target" 改成 "ESNext" 最新版
console.log(max + 1n === max + 2n); //false

// number 和 bigint 互不兼容
let foo: number = 10;
let bar: bigint = 10n;
// console.log(foo + bar); // 报错 运算符“+”不能应用于类型“number”和“bigint”。
// console.log(foo = bar); // 报错 不能将类型“bigint”分配给类型“number”。

14. object 类型

这个特殊的类型object可以表示任何不是原始类型(primitive)的值(string、number、bigint、boolean、symbol、null、undefined)。object类型不同于空对象类型{ }，也不同于全局类型Object。

15. unknown 类型

unknown类型可以表示任何值。有点类似于any，但是更安全，因为对unknown类型的值做任何事情都是不合法的：

function fn(a: any) {
  a.b() // Ok
}

function fn1(b: unknown) {
  b.a() //对象的类型为 "unknown"。
}