js设计模式-工厂模式

js设计模式-工厂模式

1.简单工厂模式

假设我要批量生产车。
第一我们会想直接创建一个构造函数，然后重复new来批量生产。

class  CreateCar{
	constructor(brand){
		this.brand = brand
	},
	run(){
		console.log('跑');
	}
}

let car = new CreateCar('宝马');

这样我就可以批量生产车了，但是如果我想生产一部其他功能的车怎么办 CreateCar这个函数就无法生产了
这是我就可以开个工厂用来生产各式不同需求的车

// 这是所有车都有的基础属性和功能
class  CreateCar{
	constructor(brand){
		this.brand = brand
	},
	run(){
		console.log('跑');
	}
}
// 这个是要产生宝马的小作坊
class Carbm extends CreateCar {
	constructor(brand){
		super(brand);
        this.value = '80万';
	}
}
// 这个是要产生奔驰的小作坊
class Carbc extends CreateCar {
	constructor(brand){
		super(brand);
        this.value = '85万';
	}
}
// 这就是生产车间的工厂
class Factory{
    static create(type) {
        switch (type) {
            case 'bm':
                return new Carbm ('宝马');
            case 'bc':
                return new Carbc('奔驰');
        }
    }
}

let bm = Factory.create('bm');
let bc = Factory.create('bc');

这就可以实现Factory工厂可以生产各种功能的车，每部生产的车和小作坊进行解耦。

2.工厂方法模式

上面的简单工厂模式不符合设计模式的开闭原则(对扩展开发，对修改关闭)，当我每添加一个需求生产不同的车时就要去修改Factory方法 添加一个key。

这就可以

1. 工厂方法模式Factory Method，又称多态性工厂模式。
2. 在工厂方法模式中，核心的工厂类不再负责所有的产品的创建，而是将具体创建的工作交给子类去做。

// 车的基本功能 规定车必须有的方法和属性
class Car {
	constructor(brand){
		this.brand = brand
	},
	run(){
		console.log('跑');
	}
}

// 宝马车自有的功能
class BmCar extends Car{
	construction(brand){
		super(brand);
		this.value = '80万';
	}
}

// 奔驰车自有的功能
class BcCar extends Car{
	construction(brand){
		super(brand);
		this.value = '85万';
	}
}

// 工厂的定义 规定工厂必须有的方法和属性
// 依赖抽象，而不依赖实现 可以理解成接口的定义
class Factory {
	create(){}
}

// 宝马车生产工厂
class BmFactory extends Factory {
	create(){
		return new BmCar('宝马');
	}
}

// 奔驰车生产工厂
class BcFactory extends Factory {
	create(){
		return new BcCar('奔驰');
	}
}

const settings={
    'bm': BmFactory,
    'bc':BcFactory
}

let bm = settings['bm'].create();
let bc = settings['bc'].create();

这样每种车就他单独的工厂了。每当有新的类型车的产生就添加这个车和生产车的工厂就可以了，这样就达到每种工厂之间解耦。

3.抽象工厂模式

1. 抽象工厂模式是指当有多个抽象角色时，使用的一种工厂模式
2. 抽象工厂模式可以向客户端提供一个接口，使客户端在不必指定产品的具体的情况下，创建多个产品族中的产品对象

// 车轮
class CarriageWheel{
    create() {
    }
}

class BmCarriageWheel extends CarriageWheel{
    create() {
       console.log('宝马车轮');
    }
}

class BcCarriageWheel extends CarriageWheel{
    create() {
       console.log('奔驰车轮');
    }
}

// 车架
class CantFrame{
    create() {
    }
}

class BmCantFrame extends CantFrame{
    create() {
       console.log('宝马车架');
    }
}

class BcCantFrame extends CantFrame{
    create() {
       console.log('奔驰车架');
    }
}
// 汽车工厂
class Factory{
    createCarriageWheel() {}
    createCantFrame() {}
}

// 宝马生产工厂
class BmFactory extends Factory{
    createCarriageWheel() {
        return new BmCarriageWheel();
    }
    createCantFrame() {
        return new BmCantFrame();
    }
}

// 奔驰生产工厂
class BcFactory extends Factory{
    createCarriageWheel() {
        return new BcCarriageWheel();
    }
    createCantFrame() {
        return new BcCantFrame();
    }
}

const settings={
    'bm': BmFactory,
    'bc':BcFactory
}

let bmFactory = new settings['bm']();
bmFactory.createCarriageWheel().create();
bmFactory.createCantFrame().create();

let bcFactory = new settings['bc']();
bcFactory.createCarriageWheel().create();
bcFactory.createCantFrame().create();

这样把工厂进行抽象化了，意思就是宝马车轮(BmCarriageWheel ) 和奔驰车轮(BcCarriageWheel ) 就可以抽象化成车轮(CarriageWheel) 以此类推 车架 (CantFrame)和汽车工厂 (CantFrame)就可以抽象出来了。