资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/JS 抽象工厂模式

JS 抽象工厂模式

RiverLi / 2248人阅读

摘要：简介抽象工厂模式就是通过类的抽象使得业务适用于一个产品类簇的创建，而不负责某一类产品的实例。通过抽象工厂，就可以创建某个类簇的产品，并且也可以通过来检查产品的类别，也具备该类簇所必备的方法。

0. 简介

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

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

</>复制代码 
  1. const Car = function() { }
  2. Car.prototype.getPrice = function() {return new Error("抽象方法不能调用")}
1. 实现

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

</>复制代码 
  1. /**
  2. * 实现subType类对工厂类中的superType类型的抽象类的继承
  3. * @param subType 要继承的类
  4. * @param superType 工厂类中的抽象类type
  5. */
  6. const VehicleFactory = function(subType, superType) {
  7.   if (typeof VehicleFactory[superType] === "function") {
  8.     function F() {
  9.       this.type = "车辆"
  10.     } 
  11.     F.prototype = new VehicleFactory[superType]()
  12.     subType.constructor = subType
  13.     subType.prototype = new F()                // 因为子类subType不仅需要继承superType对应的类的原型方法，还要继承其对象属性
  14.   } else throw new Error("不存在该抽象类")
  15. }
  16. VehicleFactory.Car = function() {
  17.   this.type = "car"
  18. }
  19. VehicleFactory.Car.prototype = {
  20.   getPrice: function() {
  21.     return new Error("抽象方法不可使用")
  22.   },
  23.   getSpeed: function() {
  24.     return new Error("抽象方法不可使用")
  25.   }
  26. }
  27. const BMW = function(price, speed) {
  28.   this.price = price
  29.   this.speed = speed
  30. }
  31. VehicleFactory(BMW, "Car")        // 继承Car抽象类
  32. BMW.prototype.getPrice = function() {        // 覆写getPrice方法
  33.   console.log(`BWM price is ${this.price}`)
  34. }
  35. BMW.prototype.getSpeed = function() {
  36.   console.log(`BWM speed is ${this.speed}`)
  37. }
  38. const baomai5 = new BMW(30, 99)
  39. baomai5.getPrice()                          // BWM price is 30
  40. baomai5 instanceof VehicleFactory.Car       // true
2. 总结

抽象类创建出的结果不是一个真实的对象实例，而是一个类簇，它指定了类的结构，这也就区别于简单工厂模式创建单一对象，工厂模式创建多类对象。

通过抽象工厂，就可以创建某个类簇的产品，并且也可以通过instanceof来检查产品的类别，也具备该类簇所必备的方法。

本文是系列文章，可以相互参考印证，共同进步~

</>复制代码 
  1. JS 抽象工厂模式
  2. JS 工厂模式
  3. JS 建造者模式
  4. JS 原型模式
  5. JS 单例模式
  6. JS 回调模式
  7. JS 外观模式
  8. JS 适配器模式
  9. JS 利用高阶函数实现函数缓存(备忘模式)
  10. JS 状态模式
  11. JS 桥接模式
  12. JS 观察者模式

网上的帖子大多深浅不一，甚至有些前后矛盾，在下的文章都是学习过程中的总结，如果发现错误，欢迎留言指出~

</>复制代码 
  1. 参考：《Javascript 设计模式》 - 张荣铭

PS：欢迎大家关注我的公众号【前端下午茶】，一起加油吧~

另外可以加入「前端下午茶交流群」微信群，长按识别下面二维码即可加我好友，备注加群，我拉你入群～

GPU云服务器 云服务器 抽象工厂模式 java抽象工厂模式 工厂模式 工厂方法模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/92105.html

相关文章

  • js常用设计模式实现（二）工厂模式和抽象工厂模式

    摘要：抽象工厂模式可以向客户端提供一个接口，使客户端在不必指定产品的具体的情况下，创建多个产品族中的产品对象。前边的两个都是直接生产实例的，开始以为抽象工厂也是但是后来发现抽象工厂更像是生产工厂，其实抽象工厂其实是实现子类继承父类的方法。 创建型模式 创建型模式是对一个类的实例化过程进行了抽象，把对象的创建和对象的使用进行了分离 上一篇介绍了下单例模式，这一篇介绍一下工厂模式和抽象工厂模式，...

    meteor199 评论0 收藏0

  • 一天一个设计模式之JS实现——工厂模式

    摘要：参考文章深入理解三种工厂模式工厂模式，工厂方法模式，抽象工厂模式详解工厂模式是中最常用的设计模式之一。这种类型的设计模式属于创建型模式，它提供了一种创建对象的最佳方式。 参考文章：深入理解java三种工厂模式工厂模式，工厂方法模式，抽象工厂模式 详解 工厂模式（Factory Pattern）是 Java 中最常用的设计模式之一。这种类型的设计模式属于创建型模式，它提供了一种创建对象的...

    Muninn 评论0 收藏0

  • JS 设计模式 七（抽象工厂模式）

    摘要：抽象工厂模式抽象工厂是工厂模式的升级版，他用来创建一组相关或者相互依赖的对象。代码抽象工厂模式抽象工厂的优点抽象工厂模式除了具有工厂方法模式的优点外，最主要的优点就是可以在类的内部对产品族进行约束。 抽象工厂模式 抽象工厂是工厂模式的升级版，他用来创建一组相关或者相互依赖的对象。上节学习了工厂模式，类的创建依赖工厂类，程序需要扩展时，我们必须创建新的工厂类。工厂类是用来生产产品的，那我...

    FuisonDesign 评论0 收藏0

  • 从ES6重新认识JavaScript设计模式(二): 工厂模式

    摘要：简单工厂模式简单工厂模式又叫静态工厂模式，由一个工厂对象决定创建某一种产品对象类的实例。工厂方法模式工厂方法模式的本意是将实际创建对象的工作推迟到子类中，这样核心类就变成了抽象类。抽象工厂模式一般用在 1 什么是工厂模式? 工厂模式是用来创建对象的一种最常用的设计模式。我们不暴露创建对象的具体逻辑，而是将将逻辑封装在一个函数中，那么这个函数就可以被视为一个工厂。工厂模式根据抽象程度的不...

    Reducto 评论0 收藏0

  • 从ES6重新认识JavaScript设计模式(二): 工厂模式

    摘要：简单工厂模式简单工厂模式又叫静态工厂模式，由一个工厂对象决定创建某一种产品对象类的实例。工厂方法模式工厂方法模式的本意是将实际创建对象的工作推迟到子类中，这样核心类就变成了抽象类。抽象工厂模式一般用在 1 什么是工厂模式? 工厂模式是用来创建对象的一种最常用的设计模式。我们不暴露创建对象的具体逻辑，而是将将逻辑封装在一个函数中，那么这个函数就可以被视为一个工厂。工厂模式根据抽象程度的不...

    szysky 评论0 收藏0

发表评论

登陆后可评论

0条评论

RiverLi

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<