JavaScript設計模式系列四：原型模式

這篇文章要跟大家分享的是關於JavaScript設計模式系列四：原型模式，有興趣的朋友可以看一下

本系列程式碼已上傳到GitHub地址JavaScript設計模式demo

什麼是原型模式

原型模式 （Prototype pattern）：通俗點講就是創造一個共享的原型，並透過拷貝這些原型創造新的物件。用於建立重複的對象，這種類型的設計模式屬於創建型模式，它提供了一種創建對象的不錯選擇。

實作原型模式

我們可以透過JavaScript特有的原型繼承特性去實作原型模式，也就是建立一個物件作為另一個物件的prototype屬性值，我們也可以透過Object.create (prototype, optionalDescriptorObjects)來實現原型繼承。

// 因为不是构造函数，所以不用大写
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設計模式系列一：工廠模式

JavaScript設計模式系列二：單例模式

JavaScript設計模式系列三：建造者模式

以上是JavaScript設計模式系列四：原型模式的詳細內容。更多資訊請關注PHP中文網其他相關文章！