位置: IT常识 - 正文
TS中快速定义一个对象数组以及处理async await的异常(ts中如何定义一个数组)
发布时间：2024-01-16TS中快速定义一个对象数组以及处理async await的异常 
本文链接地址:https://www.jiuchutong.com/zhishi/297545.html
转载请保留说明！
推荐整理分享TS中快速定义一个对象数组以及处理async await的异常(ts中如何定义一个数组)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:ts中的keyof,ts中的typeof,ts自定义类型,ts中如何定义一个数组,ts怎么设置快捷键,ts自定义类型,ts中如何定义一个数组,ts中declare,内容如对您有帮助，希望把文章链接给更多的朋友！
定义一个对象数组（即数组成员为对象，对象的属性为我们所约束）
方法一：接口字面量形式
export type Resource= {_id: string,personID: { _id: string age: string identifier: string name: string nation: string grade: string schemeNum: string organ: string sex: string}gaintestPoint:stringlooktestPoint:string[]viocetsetPoint:stringgameReview:stringAddvice:string }export type ResourceArray =Resource[]方法二：数组泛型字面量形式
export type ReArray=Array<{_id: string,personID: { _id: string age: string identifier: string name: string nation: string grade: string schemeNum: string organ: string sex: string}gaintestPoint:stringlooktestPoint:string[]viocetsetPoint:stringgameReview:stringAddvice:string }>或者你也可以这么写
索引签名的方式不能被推断为一个数组，因此不能用来约束数据
这是一种比较常见的约束数据的接口定义
// * 请求响应参数(不包含data)export interface Result {resp_code: string;msg: string;status_code: 200}// * 请求响应参数(包含data)export interface ResultData<T = any> extends Result {data: T;}接下来我们请求数据可能会这样写，这是一种严格的数据约束，包括定义响应式数组push接口数据，如果这里没有传入泛型则会报错
let result = reactive<ReArray>([])const getResult = async () => { const { data } = await http.get<ResultData<ReArray>>('/user/getpoints') result.length = 0 result.push(...data )}但这里我们没法处理接口报错的情况，比较常规的写法是try catch 这是一直非常啰嗦的写法，让我们的代码变丑，一种比较优雅的形式是引入await-to-js
安装命令 npm i await-to-js --save
使用
import to from 'await-to-js';
接下来我们的写法就变成
let result = reactive<ReArray>([])const getResult = async () => {const [err,res] =await to<ResultData<Resource[]>>(http.get('/user/getpoints')) const {data} = resresult.push(...data )}但这里事实上ts会帮我们类型推导出data有可能不存在
这时候我们可以使用非空断言!
这样就不会报错了
to返回的是一个数组
我们可以在if语句里判断err是否存在，从在再去处理逻辑
上一篇：目标检测算法——YOLOv7改进|增加小目标检测层(目标检测算法有哪些)
下一篇：MATLAB与图像处理的那点小事儿~(matlab用于图像处理)
