一. 8种内置基础类型.ts

/* eslint-disable @typescript-eslint/no-unused-vars */
// 定义类型: string
const name: string = 'jack'

// 定义类型: number
const age: number = 30

// 定义类型: boolean
const isTrue: boolean = true

// 特殊的几个:---------
// 定义undefined类型
let a: undefined

// 定义null类型
const b: null = null

// 定义object类型
const user: object = {}

// 或者
const user1: { name: string; age: number } = { name: 'zhangsan', age: 24 }

// 定义bigint类型
const big: bigint = 100n

// 定义symbol符号类型
const sym: symbol = Symbol('hepan')

export default {}

二. void、never、any、unknown类型

void类型

void表示没有任何类型，不能直接赋值。

let a: void; 
let b: number = a; // 报错

给变量赋值为void是没有意义的。

如果一个函数没有返回值，此时我们可以定义为void

function fn():void {
    console.log('今天天气不错')
}


<a href="javascript:void;"></a>

never类型

never类型表示永不存在的值的类型。
(在报错或者死循环时候使用)

// 抛出异常
function error(): never {
  throw new Error('我是一个Error'); 
}

// 死循环
function loop(): never {
  while (true) {
    console.log('这里是死循环')
  };
}

any类型

any类型表示任意类型。

let num:number = 1000;
num = "jack" // 报错


let num:any = 1000;
num = "jack" // 不报错


// 调用方法，依然不报错
num.setName('jack')

虽然any不做任何约束，但是非常不推荐这样使用，这样会带来隐患。

我们在开发组件、模块、定义函数、调用接口时，如果类型很难定义出来、不知道属于什么类型等场景，可以适当使用any类型。

unknown类型

unknown与any一样，所有类型都可以分配给unknown，反之把unknown 赋值给其它类型会报错。

// unknown 可以接收任意类型
let name:string = "jack"
let user:unknown = name;

// unknown 不可以赋值给其它类型，any除外，下面会报错
let name:unknown = "jack"
let user:string = name;

(在报错或者死循环时候使用)

// 抛出异常
function error(): unknown {
  throw new Error('我是一个Error'); 
}

// 死循环
function loop(): unknown {
  while (true) {
    console.log('这里是死循环')
  };
}

总结：

• 能确定类型的，尽量定义类型。

• 无法确定类型的，可以使用 any 进行兜底。

• 当函数没有返回值时，可以使用void定义。

• any和unknown可以接收任意类型值，any可以赋值给任意类型，但unknown不可以赋值给任意类型。

• void和any在项目中是比较常见的，never和unknown不常用。

三. 数组和函数类型定义.ts

// 数组类型的定义
const list1: number[] = [1, 2, 3]

const list2: Array<number> = [1, 2, 3]

const list3: [number, string, boolean] = [1, '2', true]

const list4: [{ name: string; age: number }] = [{ name: 'jack', age: 30 }]

const list5: Array<{ name: string; age: number }> = [{ name: 'jack', age: 30 }]

interface User {
  name: string
  age: number
}

const list6: Array<User> = [{ name: 'jack', age: 30 }]

// 函数类型的定义
// :在函数括号后加冒号
// 变量类型定义:在变量后加冒号

function add1(a: number, b: number): number {
  return a + b
}

function add2(a: number, b: number): void {
  console.log(a + b)
}

// 定义报错用unkown
function add3(a: number, b: number): unknown {
  throw new Error('Error')
}

// 箭头函数两种定义
// (括号后面加冒号)
const add4 = (a: number, b: number): number => {
  return a + b
}

// (变量后加冒号)
const add5:(a: number, b: number) => number = (a: number, b: number) => {
  return a + b
}

export default {}