JavaScript 디자인 패턴 시리즈 4: 프로토타입 패턴

이 글은 자바스크립트 디자인 패턴 시리즈 4: 프로토타입 패턴에 관한 글입니다. 관심있는 친구들은 한번 구경해보세요

이 시리즈의 코드는 GitHub 주소 자바스크립트 디자인 패턴 데모에 업로드되어 있습니다

프로토타입 패턴이란 무엇인가요

프로토타입 패턴(프로토타입 패턴): 일반인의 용어로 말하면 공유 프로토타입을 만들고 이러한 프로토타입을 복사하여 새로운 개체를 만드는 것을 의미합니다. 반복되는 개체를 만드는 데 사용되는 이러한 유형의 디자인 패턴은 개체를 만드는 데 좋은 선택을 제공하는 생성 패턴입니다.

프로토타입 패턴 구현

자바스크립트 고유의 프로토타입 상속 기능, 즉 다른 개체의 프로토타입 속성 값으로 개체를 생성하여 프로토타입 패턴을 구현할 수도 있습니다. ) 상속합니다.

// 因为不是构造函数，所以不用大写
var someCar = {
    drive: function () { },
    name: '马自达 3'
};

// 使用Object.create创建一个新车x
var anotherCar = Object.create(someCar);
anotherCar.name = '丰田佳美';

Object.create() 메서드는 지정된 프로토타입 개체와 해당 속성을 사용하여 새 개체를 만듭니다.

var vehicle = {
    getModel: function () {
        console.log('车辆的模具是：' + this.model);
    }
};

var car = Object.create(vehicle, {
    'id': {
        value: MY_GLOBAL.nextId(),
        enumerable: true 
 },
    'model': {
        value: '福特',
        enumerable: true
    }
});

Object.create를 직접 사용하는 대신 프로토타입 패턴을 직접 구현하고 싶다면. 이를 달성하려면 다음 코드를 사용할 수 있습니다.

var vehiclePrototype = {
    init: function (carModel) {
        this.model = carModel;
    },
    getModel: function () {
        console.log('车辆模具是：' + this.model);
    }
};


function vehicle(model) {
    function F() { };
    F.prototype = vehiclePrototype;

    var f = new F();

    f.init(model);
    return f;
}

var car = vehicle('福特Escort');
car.getModel();

요약:

프로토타입 모드는 공유 프로토타입을 생성하고, 이 프로토타입을 복사하여 새로운 클래스를 생성하는 모드로, 중복 객체 생성 및 성능 향상에 사용됩니다.

톰 아저씨의 블로그 디자인 패턴의 프로토타입 패턴에서 참조됨

관련 권장 사항:

JavaScript 디자인 패턴 시리즈 1: 팩토리 패턴

JavaScript 디자인 패턴 시리즈 2: 싱글턴 패턴

JavaScript 디자인 패턴 시리즈 3: 빌더 모드

위 내용은 JavaScript 디자인 패턴 시리즈 4: 프로토타입 패턴의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!