前端常用的设计模式总结——工厂模式

工厂模式的直观目的就是减少代码中new出现的次数
工厂工厂,就像是流水线,将材料(参数)放进去,给你返回一个加工好的产品(实例对象)
一般我们会封装一个构造函数,并在其中去return new Fun(),也就是return我们想要的实例对象,这样我们想要去获取某个构造函数的实例,就不需要写那么多new了,而是可以直接调用使用了工厂模式的函数,将参数传进去,就可以获得我们想要的实例

// 简单工厂模式
class Target {
	name: string
	constructor(name: string) {
		this.name = name
	}
	fn() {console.log(this.name)}
}
// 工厂
class Creator {
	create(name: string): Target {
		return new Target(name)
	}
}
const creator = new Creator()
const t1 = creator.create('张三')
const t2 = creator.create('李四')

简单的工厂模式非常的直观,而标准的工厂模式,会在工厂函数里边添加一些逻辑判断或者业务逻辑

// 标准的工厂模式
type FnType = () => void
interface ITarget {
	name: string
	fn: FnType
}
class Target1 implements ITarget {
	name: string
	constructor(name: string) {
		this.name = name
	}
	fn() {console.log(this.name)}
}
class Target2 implements ITarget {
	name: string
	constructor(name: string) {
		this.name = name
	}
	fn() {console.log(this.name)}
}
// 工厂
class Creator {
	create(type: string, name: string): ITarget {
		if (type === 'A') {
			return new Target1(name)
		}
		if (type === 'B') {
			return new Target2(name)
		}
		throw new Error('Invalid type')
	}
}
const creator = new Creator()
const t1 = creator.create('A', '张三')
const t2 = creator.create('B', '李四')

你可能感兴趣的:(前端,设计模式,javascript)