- Render 函数中定义函数传参
interface List {id: number;name: string;
}interface Result {data: List[]; //表示由 List 接口组成的数组
}function Render(result: Result) {result.data.forEach(value => {console.log(value);});
}let result = {data: [{id: 1,name: '张三',},{id: 2,name: '李四',},{id: 3,name: '王五',},],
};Render(result);
- 规范参数可选属性和只读属性
interface List {readonly id: number;name: string;age?: number;
}
- 函数传参时如何绕过类型检查
如果在接收的后端数据中，比约定好的接口多了一个字段，能否通过类型检查？会不会报错？
let result1 = {data: [{ id: 1, name: 'a', sex: 'male' },{ id: 2, name: 'b' },],
};
//这样是不会报错的，只要满足接口约定的必要条件即可
Render(result1);
//但如果这样调用，会报错，因为无法通过sex:"man"的类型检查。这时候需要用其他方法
Render({data: [{ id: 1, name: 'a', sex: 'male' },{ id: 2, name: 'b' },],
});
我们有三种方法：
- 通过接口定义变量，函数调用时传入变量名(只对必要的约定条件进行检查,多余的数据不做检查)
- 类型断言(所有约定都不做类型检查,失去了ts类型检查的意义)
- 索引签名
//类型断言
Render({data: [{ id: 'b', name: 3, sex: 'man' },{ id: 2, name: 'b' },],
} as Result); // 明确告诉编译器，数据符合Result，这样，编译器会绕过类型检查//使用索引签名解决
interface List {id: number;name: string;[sex: string]: any;
}
使用接口来定义函数的传参、返回值的类型
interface Add1 {(x: number, y: number): number;
}
let add1: Add1 = (a, b) => a + b;
使用类型别名来定义来函数的传参、返回值的类型
type Add2 = (x: number, y: number) => number;
let add2: Add2 = (a, b) => a + b;
直接在函数体中定义来函数的传参、返回值的类型
const Add3 = (x: number, y: number): number => {return x + y;
};
