1 工厂模式
class Axios {}
class A {
create() {
return new Axios()
}
}
const axios = new A();
export default axios
通过axios.create()创建实例
const httpRequest1 = axios.create();
const httpRequest2 = axios.create();
const httpRequest3 = axios.create();
const httpRequest4 = axios.create();
2 单例模式
封装一个类(里面有属性、方法;将实例暴露出去)
其他文件只用这一个类;
这就是单例模式
3 策略模式
根据不同策略做不同的事(对修改关闭)
const doSomethingMap = {
20: () => { },// doSomething,
30: () => { },// doSomething,
40: () => { },// doSomething,
}
const doSomething = (age) => {
doSomething[age]?.()
}
4 适配器模式
将一种格式适配成需要的格式
const data1 = [{ age1: 20, name1: 'Jayson1' }];
const data2 = [{ age2: 20, name2: 'Jayson2' }];
const data3 = [{ age3: 20, name3: 'Jayson3' }];
const transformData1 = (data) => {
return data.map(({ age1, name1 }) => {
return {
age: age1,
name: name1,
};
})
};
console.log('=====>transformData1', transformData1(data1))
5 装饰器模式
将普通人变成超级人
class Man {
say() {
console.log('我是普通人')
}
}
class SuperMan {
constructor(man) {
this.man = man;
}
say() {
console.log('我是超人')
}
}
const man = new Man();
const superMan = new SuperMan(man);
man.say(); // 我是普通人
superMan.say(); // 我是超人
6 代理模式
微前端qiankun框架有proxy代理
const handler = {
get: function(obj, prop) {
return prop in obj ? obj[prop] : 7;
}
}
const p = new Proxy({}, handler);
p.a = 1;
p.b = undefined;
console.log('===>p', p) // { a: 1, b: undefined }
console.log('===p里面是否有c属性', 'c' in p, p.c); // false 7
7 观察者模式
on、emmit、off;
subscribe