一、属性的接口
属性接口,专门用来约束对象中的每一个属性。
基础语法:
interface 接口名 {
属性名: 类型;
属性名: 类型;
// ...
}
案例:
interface Info {
id: number;
name: string;
age?: number;
sayHello?: () => void
}
const user: Info = {
id: 1,
name: 'Lee',
age: 20
}
const admin: Info = {
id: 2,
name: 'Wang',
sayHello: () => {
console.log('hello');
}
}
二、函数的接口
函数的接口分为两种情况:
函数属性接口:通过接口去约束函数参数和返回值的类型;
函数类型接口:通过接口去约束函数的类型;
1、函数属性接口
基础语法:
interface 接口名 {
属性名:属性类型;
属性名:属性类型;
}
function 函数名(参数名: 接口名): 返回值类型 {
}
案例:
interface MyParams {
x: number;
y: number;
}
function add(params: MyParams): number {
return params.x + params.y;
}
add({ x: 1, y: 2 })
接口除了用来定义函数的参数外,也可以用来定义函数的返回值。
interface MyParams {
x: number;
y: number;
}
function add(params: MyParams[]): MyParams {
return params[0];
}
add([{ x: 1, y: 2 }])
2、函数类型接口
可以使用 interface 来定义函数的类型。
基础语法:
interface 接口名 {
(参数名: 参数值, 参数名: 参数值): 返回值类型
}
案例代码:
interface AddFn {
(x: number, y: number): number
}
const add: AddFn = (x, y) => {
return x + y;
}
add(1, 2)
在一个接口中,也可以使用另一个接口:
interface MyParams {
x: number;
y: number;
}
interface AddFn {
(params: MyParams): number
}
const add: AddFn = (params) => {
return params.x + params.y;
}
add({ x: 1, y: 2 })