浅析JS抽象工厂模式
2019/6/27 20:30:56
本文主要是介绍浅析JS抽象工厂模式,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
以下就是作者学习中遇到的问题以及代码实例,最后还给大家关于JS抽象工厂模式的学习做了总结。
抽象工厂模式(Abstract Factory)就是通过类的抽象使得业务适用于一个产品类簇的创建,而不负责某一类产品的实例。
JS中是没有直接的抽象类的,abstract是个保留字,但是还没有实现,因此我们需要在类的方法中抛出错误来模拟抽象类,如果继承的子类中没有覆写该方法而调用,就会抛出错误。
const Car = function() { } Car.prototype.getPrice = function() {return new Error('抽象方法不能调用')}
实现
面向对象的语言里有抽象工厂模式,首先声明一个抽象类作为父类,以概括某一类产品所需要的特征,继承该父类的子类需要实现父类中声明的方法而实现父类中所声明的功能:
/** * 实现subType类对工厂类中的superType类型的抽象类的继承 * @param subType 要继承的类 * @param superType 工厂类中的抽象类type */ const VehicleFactory = function(subType, superType) { if (typeof VehicleFactory[superType] === 'function') { function F() { this.type = '车辆' } F.prototype = new VehicleFactory[superType]() subType.constructor = subType subType.prototype = new F() // 因为子类subType不仅需要继承superType对应的类的原型方法,还要继承其对象属性 } else throw new Error('不存在该抽象类') } VehicleFactory.Car = function() { this.type = 'car' } VehicleFactory.Car.prototype = { getPrice: function() { return new Error('抽象方法不可使用') }, getSpeed: function() { return new Error('抽象方法不可使用') } } const BMW = function(price, speed) { this.price = price this.speed = speed } VehicleFactory(BMW, 'Car') // 继承Car抽象类 BMW.prototype.getPrice = function() { // 覆写getPrice方法 console.log(`BWM price is ${this.price}`) } BMW.prototype.getSpeed = function() { console.log(`BWM speed is ${this.speed}`) } const baomai5 = new BMW(30, 99) baomai5.getPrice() // BWM price is 30 baomai5 instanceof VehicleFactory.Car // true
总结
通过抽象工厂,就可以创建某个类簇的产品,并且也可以通过instanceof来检查产品的类别,也具备该类簇所必备的方法。
这篇关于浅析JS抽象工厂模式的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-30React Native常用组件-点击组件
- 2024-05-30uniapp+vue3+uv-ui手机端后台OA管理模板
- 2024-05-29Python网络爬虫的时候json=就是让你少写个json.dumps()
- 2024-05-27React Native常用组件-展示组件
- 2024-05-27React Native常用组件-列表组件
- 2024-05-09vue3开发前端表单缓存自定义指令,移动端h5必备插件
- 2024-05-09React Hooks在class组件中的使用方式
- 2024-03-30[OIDC in Action] 2. 基于OIDC(OpenID Connect)的SSO(纯JS客户端)
- 2024-03-29terraform jsonencode
- 2024-03-13vuex-persist