JS 추상 팩토리 패턴을 자세히 분석해 보세요.

이 글은 주로 JS 추상 팩토리 패턴을 배울 때 저자의 경험과 요약을 요약한 것입니다. 관심 있는 친구들은 따라해 볼 수 있습니다.

다음은 제가 공부하면서 겪었던 문제와 코드 예시입니다. 마지막으로 JS 추상 팩토리 패턴에 대해 학습한 내용을 요약하겠습니다.

Abstract Factory 패턴(Abstract Factory)은 클래스 추상화를 사용하여 특정 유형의 제품 인스턴스에 대한 책임을 지지 않고 제품 클래스 클러스터 생성에 적합한 비즈니스를 만듭니다.

JS에는 직접적인 추상 클래스가 없습니다. Abstract는 예약어이지만 아직 구현되지 않았습니다. 따라서 상속된 하위 클래스가 재정의되지 않으면 클래스 메서드에서 오류를 발생시켜야 합니다. 호출된 이 메소드는 오류가 발생합니다.

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

Implementation

객체 지향 언어에는 추상 팩토리 패턴이 있습니다. 먼저, 특정 유형의 제품에 필요한 특성을 요약하기 위해 추상 클래스를 상위 클래스로 선언합니다. 클래스에 선언된 메서드는 상위 클래스에 선언된 함수를 구현합니다.

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

Summary

추상 팩토리를 통해 특정 클래스 클러스터의 제품을 만들 수 있으며 다음과 같은 작업을 수행할 수 있습니다. 또한 인스턴스 오브를 통해 제품 카테고리를 확인하세요. 또한 이러한 유형의 클러스터에 필요한 메소드도 있습니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

JS 파일을 동적으로 로드하는 세 가지 방법 요약

js 게시물 요청을 지원하는 도메인 간 방법 요약

Vue.js계산 및 리스너 속성에 대한 자세한 설명 사용법

위 내용은 JS 추상 팩토리 패턴을 자세히 분석해 보세요.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!