JavaScript之幾種建立函數的區別以及優缺點。

來源:互聯網
上載者:User

標籤:因此   friend   識別   影響   markdown   大量   建議   思路   有一個   

原廠模式
function createPerson(name,age,job){    var o = new Object();    o.name = name;    o.age = age;    o.job = job;    o.sayName = function(){        alert(this.name);    };    return o;}var person1 = createPerson("tom",20,"trtr");var person2 = createPerson("tom1",24,"httt");

優點:使用同一個介面建立很多獨享,避免大量的重複代碼。
缺點:沒有解決對象識別問題,怎樣知道一個對象的類型。

建構函式模式

建構函式就是為瞭解決原廠模式的缺點,將它的執行個體標識為一種特定類型。
缺點:每個方法都要在每個執行個體撒很重新建立一遍。

function Person(name,age,job){    this.name = name;    this.age = age;    this.job = job;    this.sayName = function(){        alert(this.name)    }}var person1 = new Person("gr",12,"Grgr");var person2 = new Person("gr44",45,"4y4");
原型模式

每個函數都有一個prototype的原型屬性,是一個指標,指向一個對象,這個對象的用途是包含可以由特定類型的所有執行個體共用的屬性和方法。

優點:讓所有對象執行個體共用它所包含的屬性和方法。將這些資訊直接添加到原型對象中。
function Person(){}Person.prototype.name = "tom";Person.prototype.age = 29;Person.prototype.jobn = "ghrrh";var person = new Person();
原型模式下的一個坑
function Person(){}Person.prototype.name = "tom";Person.prototype.age = 29;Person.prototype.job = "ghrrh";//有些時候為了圖方面會將其寫成下面這樣Person.prototype = {    name: "tom",    age: 29,    job: "ghrrh"}//但是這時候無意間就重寫了預設的prototype對象,因此constructor屬性變成了新對象的constructor屬性(指向Object建構函式),不再指向Person函數var person = new Person();
對了這裡還要介紹一個原型對象:

無論什麼時候,建立一個新函數,就會根據一組特定的規則建立一個prototype屬性,這個屬性會指向prototype對象。在預設情況下,所有原型對象都會獲得一個constructor屬性,這個屬性包含一個指向prototype屬性所在函數的指標。

缺點:

實際上,很少的人會單獨使用原型模式,因為原型模式是讓所有對象執行個體都共用一個原型對象上的屬性和方法。
對於基本類型還可以,可以在執行個體中定義,然後覆蓋原型中的,但是對於參考型別,修改一個執行個體上(person1)的一個參考型別的屬性,就會引起另一個執行個體(person2)的參考型別的改變,其實我們要的不是這種效果。因此出現建構函式和原型模式結合使用。

組合使用建構函式模式和原型模式
function Person(name,age,job){    this.name = name;    this.age = age;    this.job = job;    this.friends = ["tom","tom1"];}Person.prototype = {    constructor: Person,    sayName: function(){        alert(this.name);    }}var person1 = new Person("tom",20,"hhtt");var person2 = new Person("tom1",45,"chengxuyuan");
動態原型模式

有時候像這種分開寫構造和原型,很可能會感到非常困惑。
動態原型模式解決這個問題,它將所有資訊都封裝在了建構函式中,而通過在建構函式中初始化原型(僅在必要的情況下)。

function Person(name,age,job){    this.name = name;    this.age = age;    this.job = job;    if(typeof this.sayName != "function"){        Person.prototype.sayName = function(){            alert(this.name);        }    }}
寄生建構函式模式

建議在可以使用其他模式的情況下,不要使用這種模式。

穩妥建構函式模式

穩妥對象:顧名思義,就是很穩妥,指的是沒有公用屬性,而且其方法也不引用this的對象。穩妥對象最適合在一些安全的環境中(這些環境中會禁止使用this和new)。

function Person(naem,age,job){    var o = new Object();    o.sayName = function(){        alert(name);    }}var friend = new Person("gg",20,"ghrhr");friend.sayName(); //gg

總結:最開始是原廠模式。
為了標識特定類型的對象,出現建構函式模式。
為了減少建立多個沒有多大關係的執行個體,浪費記憶體,出現原型模式。
為了減少修改一個執行個體上的屬性而影響到另一個執行個體的屬性,此時出現原型模式和建構函式相結合的模式。
至於後來的動態原型模式,寄生建構函式模式,穩妥建構函式模式,這些自己斟酌使用。
總結在這裡,為大家提供一種記憶思路。

JavaScript之幾種建立函數的區別以及優缺點。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.