本文知识点
- 全局类型声明和模块
现实场景
在使用axios的时候,我们总会对其进行一些封装或者配置以更简单地用于各自的项目,但一个问题是封装出来的东西或许并不好用,其中一个原因就是axios自带的类型定义,它往往会给出一些不合时宜的提示比如这个。 
type ResponseData<T = any> = {code: numberdata: Tmessage: string
}
点进去可以看到这就是返回类型
理论上我们可以对这个文件进行直接修改,但不巧的是这个文件属于第三方库,在node_modules中,那么是否有在本地代码中修改的方法呢,有的,而且极为简单,在源码文件夹下新建一个types.d.ts文件,并将node_modules/.pnpm/axios@0.27.2/node_modules/axios/index.d.ts复制到其中并做如下修改 
需要注意的是,一般情况下我们并不应该直接修改第三方库的类型定义,因为你无法知道是否有别的库依赖这个定义,当然,如果你确定没有,那就改呗。不过更常用的方法是在外面封装一层,对类型进行一个断言,毕竟我们用这些库的时候往往会针对对其做一些适用于项目的增强,顺带就把类型搞了。
知识点解释
全局类型声明
我们在新建的type.d.ts文件中全局声明了一个模块,在TS寻找类型定义的时候优先查找到了此处声明的模块,即,我们的类型定义覆盖了axios原本的类型定义。
模块化的类型声明
刚提到的是全局类型声明,当文件中出现import或者export语句时,便是模块化的类型声明了,当把文件修改成如下内容时
编辑器提示便又恢复原状了
当然,在模块中,也可以声明全局的内容,像下面这样就行了,但需要注意的是模块声明放在declare global下是不生效的。
declare global {type MyString = String
}
最后,整理了75个JS高频面试题,并给出了答案和解析,基本上可以保证你能应付面试官关于JS的提问。




有需要的小伙伴,可以点击下方卡片领取,无偿分享
本文介绍了如何解决在使用 TypeScript 和 axios 时,返回值提示不正确的问题。通过创建全局类型声明覆盖第三方库的原有定义,以及理解全局类型声明和模块化类型声明的区别,可以实现对 axios 的拦截器返回类型进行自定义,从而提供更准确的类型提示。

1954

被折叠的 条评论
为什么被折叠?



