TypeScript 常用类型

typescript 常用类型

1. js 已有类型

   • 原始类型：number \ string \ boolean \ null \ underfined \ symbol

   • 对象类型：object（包括数组、对象、函数等对象）

2. ts 新增类型

   • 联合类型、自定义类型（类型别名）、接口、元组、字面量类型、枚举、void 、any 等

 

联合类型

let arr: (number | string)[] = [1, 'a', 2]; //联合类型声明

类型别名

// 使用 type 关键字来创建类型别名
// 类型别名，可以是任何合法的变量名称
// 创建类型别名后，直接使用该类型别名作为变量的类型注解 即可
type CustomArray = (number | string)[];
 
let arr1: CustomArray = [1, 2, 'a', 'b'];

函数类型

// 定义 参数 和 返回值 类型
function add(num1: number, num2: number): number {
    return num1 + num2
}
​
// 函数表达式声明函数
const add1 = (num1: number, num2: number): number => {
    return num1 + num2
}
​
const add2: (num1: number, num2: number) => number = (num1, num2) => {
    return num1 + num2
}
​
// 如果函数没有返回值，函数返回值类型为 void
function greet(name: string): void {
    console.log('hello');
}
​
// 可选参数
// 参数名称后面添加 ？
// 必选参数不可以在可选参数之后
function mySlice(start?: number, end?: number): void {
    console.log(start, end);
}

对象类型

// 如果一行代码只指定一个属性类型，可以去掉分号 ；
// 方法的类型也可以使用箭头函数形式
let person: { name: string; age: number; sayHi(): void; greet(name: string): void } = {
    name: '刘老师',
    age: 18,
    sayHi() { },
    greet(name) { },
}
​
let person1: {
    name: string;
    age: number;
    sayHi: () => void
    greet: (name: string) => void
} = {
    name: '刘老师',
    age: 18,
    sayHi() { },
    greet(name) { },
}
​
// 对象可选属性
function myAxios(config: { url: string; method?: string }) { }
​
myAxios({
    url: '',
    // method: 
})

接口类型

// 使用 interface 关键字声明接口, 描述对象的类型，达到复用的目的
interface IPerson {
    name: string
    age: number
    sayHi(): void
}
​
let person2: IPerson = {
    name: '李老师',
    age: 18,
    sayHi() { },
}
​
let person3: IPerson = {
    name: '李老师',
    age: 18,
    sayHi() { },
}
​
// 接口 interface 和 类型别名 type 的区别
// 相同点：都可以给对象指定类型
// 不同点：接口，只能为对象指定类型；类型别名，不仅可以为对象指定类型，实际上可以为任意类型指定别名
type IPerson2 = {
    name: string
    age: number
    sayHi(): void
}
​
let person4: IPerson2 = {
    name: '李老师',
    age: 18,
    sayHi() { },
}
​
// 两个接口有相同的属性或方法，可以将公共的属性或方法抽离出来,通过继承来实现复用
interface Point2D { x: number; y: number }
​
// 使用继承实现复用
interface Point3D extends Point2D {
    z: number
}
​
let p3: Point3D = {
    x: 1,
    y: 2,
    z: 3
}

元组类型

// 是另一种类型的数组，它确切地知道包含多少个元素，以及特定索引对应的类型
let position : [number, number] = [1, 2];

类型推断

// 类型推论的两个场景：1.声明变量并初始化值；2.函数返回值
// 能省略类型注解的地方就省略
let a = 18 //不用写类型注解