Rumah hujung hadapan web tutorial js 有关JS抽象工厂模式(详细教程)

有关JS抽象工厂模式(详细教程)

Jun 20, 2018 pm 04:48 PM
js

本篇文章主要给大家总结了一下作者在学习JS抽象工厂模式时的经验和总结,有兴趣的朋友跟着学习下吧。

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

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

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

1

2

const Car = function() { }

Car.prototype.getPrice = function() {return new Error('抽象方法不能调用')}

Salin selepas log masuk

实现

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

/**

* 实现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

Salin selepas log masuk

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

在js中如何实现判断文件类型大小

在js中如何实现登录需要滑动验证

在Angular中如何实现下拉框模糊查询功能

在Nodejs中有关crypto模块安全知识(详细教程)

在angularjs中如何实现分页和搜索功能

使用vue如何引入ueditor及node后台配置

在Node.js中如何搭建小程序后台服务

在js中有关文件加载优化方面的问题

使用nodejs+mongodb+vue如何配置ueditor

Atas ialah kandungan terperinci 有关JS抽象工厂模式(详细教程). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Tag artikel panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi pan peta Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi pan peta Nov 21, 2023 am 10:00 AM

Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi pan peta

Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik Apr 03, 2024 am 11:55 AM

Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik

Alat penting untuk analisis saham: Ketahui langkah-langkah untuk melukis carta lilin dengan PHP dan JS Alat penting untuk analisis saham: Ketahui langkah-langkah untuk melukis carta lilin dengan PHP dan JS Dec 17, 2023 pm 06:55 PM

Alat penting untuk analisis saham: Ketahui langkah-langkah untuk melukis carta lilin dengan PHP dan JS

Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok Dec 18, 2023 pm 03:39 PM

Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok

Cara membuat carta candlestick saham menggunakan PHP dan JS Cara membuat carta candlestick saham menggunakan PHP dan JS Dec 17, 2023 am 08:08 AM

Cara membuat carta candlestick saham menggunakan PHP dan JS

Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi lukisan poligon peta Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi lukisan poligon peta Nov 21, 2023 am 10:53 AM

Cara menggunakan Peta JS dan Baidu untuk melaksanakan fungsi lukisan poligon peta

Cara menggunakan JS dan Baidu Map untuk melaksanakan fungsi pemprosesan acara klik peta Cara menggunakan JS dan Baidu Map untuk melaksanakan fungsi pemprosesan acara klik peta Nov 21, 2023 am 11:11 AM

Cara menggunakan JS dan Baidu Map untuk melaksanakan fungsi pemprosesan acara klik peta

Apakah yang dilakukan oleh pengendali baharu dalam js Apakah yang dilakukan oleh pengendali baharu dalam js Nov 13, 2023 pm 04:05 PM

Apakah yang dilakukan oleh pengendali baharu dalam js

See all articles