現在很多人在學習jsp之后都會用js對象實現代碼,但在javascript中js對象是一種動態語言,很多剛入門的小伙伴們就會好奇JavaScript面向對象的的書寫方法有哪些呢?又有什么差別,現在就讓小編為大家詳解JavaScript面向對象的書寫方法及差別。
在JS中實現OOP,一般來說有兩種方法:
第一種:使用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來說,更加高效。?
javascript的對象第二步作內存占用的測試,把total.push(c);這行的注釋去掉,之所以要把它們加入到數組里面去,防止創建的時候,對象比較多的時候,沒有被引用的對象被GC了。結果發現差距不是一般的大,第一種方法要占用二三十M的內存,而第二種只需要一百多K。
javascript創建對象
成因推斷:
在處理這兩種代碼的時候,第一種,JS的解析器,給每個對象都創建一個單獨的方法,這樣增加了內存的開銷,同時創建方法的時候,增加了運行時間。第二種,JS的解析器和大部分的OOP編譯器一樣的,把對象的數據段和方法段分開存儲了,對于對象的私有數據,則是每個對象一份,而這些方法,則是放在公共的方法段里,所以可以減少運行時間和內存的開銷。
以上就是錯新小編為大家詳解JavaScript面向對象的書寫方法及差別,如果你想了解更深一點的可以進入錯新技術頻道進行了解哦。
新聞熱點
疑難解答