Home

TS中类型的使用

# 类型注解

类型注解:(number | string)[]是最简单也是最常用的声明方式,

这种方式通过在元素类型后面加上 [] 来声明一个数组,其元素可以是 number 或 string 的类型(|也被称作联合类型)

let arr: (number | string)[] = [1, "a", 2, "b", 3, "c"];
let name:string = 'momo'
let isloding: boolean = true

# 数组泛型

数组泛型:Array<number | string>,这种方式使用 Array<T> 泛型来声明数组,其中 T 是数组元素的类型

let arr: Array<number | string> = [1, "a", 2, "b", 3, "c"];

# type(类型别名)

可以定义基本类型、对象类型、联合类型、元组、交叉类型。

//基本类型
type userName = string;
//对象类型
type Person = {
  name: userName;
  age: number;
  greet: () => void;
}
type MyFunction = ()=> void //函数
//联合类型
type id = string | number;  
//元组
type Person = [string , number]
let person:Person = ['momo',18]
//交叉类型
type Name = { name: string };  
type Age = { age: number };  
type Person = Name & Age;
//等同于
type Person = {
  name: userName;
  age: number;
}

还可以定义一些更复杂的类型,用途可以是结合旧类型创建新类型,提高代码的利用率

//条件类型  T extends U ? X : Y
type IsNumber<T> = T extends number ? true : false;  
type Result = IsNumber<string>; // false  

//映射类型 
type Partial<T> = {  
    [P in keyof T]?: T[P];  
};
type Person = {
  name: userName;
  age: number;
}
type PersonPartial = Partial<Person>;
let momo: PersonPartial = {  
    name: "momo" // age 属性是可选的  
};

//索引访问类型
type Prop<T, K extends keyof T> = T[K];
type PersonProps = {  
    name: string;  
    age: number;  
};  
type NameProp = Prop<PersonProps, 'name'>; // string

//推断类型
const arr = [1, 2, 3];
type ArrayType = typeof arr; // 定义ArrayType 等于 arr推荐出的类型 number[]

上面用到了in keyofextends keyof,考虑后面出一期单独介绍这几个ts高级语法

# interface(接口)

只能定义对象类型,即使函数接口也是对象的形式与type不同

//对象类型
interface Person = {
  name: userName;
  age: number;
}
//函数
interface MyFunction {
  (x: number, y: number): number
}