扩展类型
-
以扩展
interface
为例,type
同理使用type的规则扩展,如typeA | typeB -
方式一:类型声明文件使用
declare
关键字的,直接在项目类型声明文件进行扩展
// lib.dom.d.ts
declare var Document: {
prototype: Document;
new(): Document;
};
// index.d.ts
// 扩展出一个name属性
declare interface Document {
name: string;
}
// index.ts
let test: Document = document;
console.log(test.name); // 编译通过,运行时必报错
⚠️ 这里是演示,不要瞎扩展
- 方式二:通过模块导出的扩展类型,通过继承或扩展模块
// 演示axios的CreateAxiosDefaults<any>扩展
// create方法的类型:create(config?: CreateAxiosDefaults): AxiosInstance;
axios.create(config);
config.name; // ❌ 此时绝对报错
// 方式一:通过继承扩展
// type.ts
import type { CreateAxiosDefaults } from "axios";
export interface AxiosConfig<D = any> extends CreateAxiosDefaults<D> {
name: string;
}
// index.ts
import axios form "axios";
const customConfig: AxiosConfig<any> = {};
customConfig.name // ✅
axios.create(customConfig); // ✅
// 方式二:通过类型声明文件扩展即对模块下的CreateAxiosDefaults方法扩展
// index.d.ts
import "axios"; // 这里需要引入axios是因为,`declare module`会进行覆盖
declare module "axios" {
name: string;
}
// index.ts
import type { CreateAxiosDefaults } from "axios";
const customConfig: CreateAxiosDefaults<any> = {};
customConfig.name; // ✅
axios.create(customConfig); // ✅