Über das abstrakte JS-Factory-Muster (ausführliches Tutorial)

Dieser Artikel fasst hauptsächlich die Erfahrungen und Zusammenfassungen des Autors beim Erlernen des abstrakten JS-Fabrikmusters zusammen. Interessierte Freunde können mitmachen und lernen.

Im Folgenden sind die Probleme und Codebeispiele aufgeführt, auf die der Autor während seiner Studie gestoßen ist. Abschließend fasst er auch Ihre Erkenntnisse über das abstrakte JS-Fabrikmuster zusammen.

Das Abstract Factory-Muster (Abstract Factory) nutzt Klassenabstraktion, um das Unternehmen für die Erstellung eines Produktklassenclusters geeignet zu machen, ohne für die Instanzen eines bestimmten Produkttyps verantwortlich zu sein.

Es gibt keine direkte abstrakte Klasse in JS, aber sie wurde noch nicht implementiert. Daher müssen wir einen Fehler in der Klassenmethode auslösen, um die abstrakte Klasse zu simulieren Keine Überschreibung in der geerbten Unterklasse. Wenn Sie diese Methode schreiben und aufrufen, wird ein Fehler ausgegeben.

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

Implementierung

Es gibt ein abstraktes Factory-Muster in objektorientierten Sprachen. Deklarieren Sie zunächst eine abstrakte Klasse als übergeordnete Klasse, um sie zu verallgemeinern eine bestimmte Klasse Für die vom Produkt benötigten Funktionen muss die Unterklasse, die die übergeordnete Klasse erbt, die in der übergeordneten Klasse deklarierten Methoden implementieren und die in der übergeordneten Klasse deklarierten Funktionen realisieren:

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

Das Obige ist, was ich Für alle zusammengestellt. Ich hoffe, dass es Ihnen in Zukunft nützlich sein wird.

Verwandte Artikel:

So ermitteln Sie die Dateitypgröße in js

So implementieren Sie die für die Anmeldung in js erforderliche gleitende Überprüfung

So implementieren Sie die Dropdown-Box-Fuzzy-Abfragefunktion in Angular

Informationen zu Kryptomodul-Sicherheitskenntnissen in Nodejs (ausführliches Tutorial)

So implementieren Sie Paging- und Suchfunktionen in AngularJS

So verwenden Sie Vue, um die Ueditor- und Knotenhintergrundkonfiguration einzuführen

In Node So erstellen Sie einen kleinen Programm-Hintergrunddienst in .js

Probleme bei der Dateiladeoptimierung in js

Wie man NodeJS verwendet +mongodb+vue ueditor konfigurieren

Das obige ist der detaillierte Inhalt vonÜber das abstrakte JS-Factory-Muster (ausführliches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!