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

Pluser 發布于2019-08-22 13:55 / 3029人閱讀

摘要：車輛的模具是福特如果你希望自己去實現原型模式，而不直接使用。車輛模具是福特總結原型模式，就是創建一個共享的原型，通過拷貝這個原型來創建新的類，用于創建重復的對象，帶來性能上的提升。參考自湯姆大叔的博客設計模式之原型模式

什么是原型模式

原型模式 （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();

總結：

原型模式，就是創建一個共享的原型，通過拷貝這個原型來創建新的類，用于創建重復的對象，帶來性能上的提升。

參考自湯姆大叔的博客設計模式之原型模式

云服務器 GPU云服務器原型模式 javascript設計模式云服務器四種模式 javascript命令模式

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/92632.html

JavaScript系列（四） - 收藏集 - 掘金

摘要：函數式編程前端掘金引言面向對象編程一直以來都是中的主導范式。函數式編程是一種強調減少對程序外部狀態產生改變的方式。 JavaScript 函數式編程 - 前端 - 掘金引言面向對象編程一直以來都是JavaScript中的主導范式。JavaScript作為一門多范式編程語言，然而，近幾年，函數式編程越來越多得受到開發者的青睞。函數式編程是一種強調減少對程序外部狀態產生改變的方式。因此，...

cfanr 2019-08-20 16:33 評論0 收藏0
JavaScript系列--淺析原型鏈與繼承

摘要：綜上所述有原型鏈繼承，構造函數繼承經典繼承，組合繼承，寄生繼承，寄生組合繼承五種方法，寄生組合式繼承，集寄生式繼承和組合繼承的優點于一身是實現基于類型繼承的最有效方法。一、前言繼承是面向對象（OOP）語言中的一個最為人津津樂道的概念。許多面對對象（OOP）語言都支持兩種繼承方式:：接口繼承和實現繼承。接口繼承只繼承方法簽名,而實現繼承則繼承實際的方法。由于js中方法沒有簽名...

draveness 2019-08-23 18:06 評論0 收藏0
JavaScript面向對象的程序設計

摘要：目錄導語理解對象和面向對象的程序設計創建對象的方式的繼承機制原型對象原型鏈與原型對象相關的方法小結導語前面的系列文章，基本把的核心知識點的基本語法標準庫等章節講解完本章開始進入核心知識點的高級部分面向對象的程序設計，這一部分的內容將會對對象目錄導語 1.理解對象和面向對象的程序設計 2.創建對象的方式 3.JavaScript的繼承機制 3.1 原型對象 3.2 原型鏈 3.3 與...

gitmilk 2019-08-20 13:30 評論0 收藏0
深入理解JavaScript

摘要：深入之繼承的多種方式和優缺點深入系列第十五篇，講解各種繼承方式和優缺點。對于解釋型語言例如來說，通過詞法分析語法分析語法樹，就可以開始解釋執行了。 JavaScript深入之繼承的多種方式和優缺點 JavaScript深入系列第十五篇，講解JavaScript各種繼承方式和優缺點。寫在前面本文講解JavaScript各種繼承方式和優缺點。但是注意：這篇文章更像是筆記，哎，再讓我...

myeveryheart 2019-08-22 13:46 評論0 收藏0
JavaScript深入之創建對象的多種方式以及優缺點

摘要：深入系列第十四篇，講解創建對象的各種方式，以及優缺點。也就是說打著構造函數的幌子掛羊頭賣狗肉，你看創建的實例使用都無法指向構造函數這樣方法可以在特殊情況下使用。 JavaScript深入系列第十四篇，講解創建對象的各種方式，以及優缺點。寫在前面這篇文章講解創建對象的各種方式，以及優缺點。但是注意：這篇文章更像是筆記，因為《JavaScript高級程序設計》寫得真是太好了！ 1....

Terry_Tai 2019-08-21 11:40 評論0 收藏0