JavaScript的物件導向方法以及差別

來源:互聯網
上載者:User

第一種:使用this關鍵字

function Class1()
{
this.onclick = function(e)
{
for (var i=0; i < 1000; i++)
{
var a = new Date();
}
}

}

使用this.的方法可以很靈活地給對象添加屬性和方法,而且和大部分的OOP語言都相似,甚至在運行中都可以添加。

第二種:使用prototype關鍵字

function clickFunc(e)
{
for (var i=0; i < 1000; i++)
{
var a = new Date();
}
}

function Class2()
{

}

Class2.prototype.onclick = clickFunc;

這種用法上來講就沒有第一種顯得靈活。不過在一個對象new出來之前,也是一樣可以隨時添加一個對象的屬性和方法。

可是他們並不是相等的,相對來說,我更喜歡第一種,因為第一種方法相對比較集中,比較容易閱讀代碼。但是在啟動並執行時候,他們啟動並執行效率卻差別相當地大。以下讓我們看一下測試代碼吧:

var total = new Array();

function Test1()
{
var a = new Date();
for (var i=0; i < 10000; i++)
{
var c = new Class1();
//total.push(c);
}
var b = new Date();
alert(b.getTime()-a.getTime());
}

function Test2()
{
var a = new Date();
for (var i=0; i < 10000; i++)
{
var c = new Class2();
//total.push(c);
}
var b = new Date();
alert(b.getTime()-a.getTime());
}

第一步作執行時間的測試:發現Test1()需要142ms,而Test2()僅需50ms.發現時間效率上來說,prototype的方法相對this來說,更加高效。

第二步作記憶體佔用的測試,把total.push(c);這行的注釋去掉,之所以要把它們加入到數組裡面去,防止建立的時候,對象比較多的時候,沒有被引用的對象被GC了。結果發現差距不是一般的大,第一種方法要佔用二三十M的記憶體,而第二種只需要一百多K。

成因推斷:
在處理這兩種代碼的時候,第一種,JS的解析器,給每個對象都建立一個單獨的方法,這樣增加了記憶體的開銷,同時建立方法的時候,增加了已耗用時間。第二種,JS的解析器和大部分的OOP編譯器一樣的,把對象的資料區段和方法段分開儲存了,對於對象的私人資料,則是每個對象一份,而這些方法,則是放在公用的方法段裡,所以可以減少已耗用時間和記憶體的開銷。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.