浅析JS抽象工厂模式

以下就是作者学习中遇到的问题以及代码实例,最后还给大家关于JS抽象工厂模式的学习做了总结。

抽象工厂模式(Abstract Factory)就是通过类的抽象使得业务适用于一个产品类簇的创建,而不负责某一类产品的实例。

JS中是没有直接的抽象类的,abstract是个保留字,但是还没有实现,因此我们需要在类的方法中抛出错误来模拟抽象类,如果继承的子类中没有覆写该方法调用,就会抛出错误

rush:xhtml;"> const Car = function() { } Car.prototype.getPrice = function() {return new Error('抽象方法不能调用')}

实现

面向对象的语言里有抽象工厂模式,首先声明一个抽象类作为父类,以概括某一类产品所需要的特征,继承该父类的子类需要实现父类中声明的方法而实现父类中所声明的功能

rush:xhtml;"> /** * 实现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来检查产品的类别,也具备该类簇所必备的方法

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...