javascript 寫(xiě)類(lèi)方式之三
更新時(shí)間:2009年07月05日 01:29:28 作者:
用構(gòu)造函數(shù)來(lái)定義類(lèi)屬性(字段) 用原型方式來(lái)定義類(lèi)的方法。
就有了第三種方式。這種方式貌似采用的人較多。
取前面兩種的優(yōu)點(diǎn):
a、用構(gòu)造函數(shù)來(lái)定義類(lèi)屬性(字段)
b、用原型方式來(lái)定義類(lèi)的方法。
就有了第三種方式。這種方式貌似采用的人較多。
3、綜合構(gòu)造函數(shù)/原型
/**
* Person類(lèi):定義一個(gè)人,有個(gè)屬性name,和一個(gè)getName方法
* @param {String} name
*/
function Person(name) {
this.name = name;
}
Person.prototype.getName = function() {
return this.name;
}
這樣,即可通過(guò)構(gòu)造函數(shù)構(gòu)造不同name的人,對(duì)象實(shí)例也都共享getName方法,不會(huì)造成內(nèi)存浪費(fèi)。
但似乎這樣的代碼風(fēng)格似乎仍然沒(méi)有java的類(lèi)那么緊湊,把屬性,構(gòu)造方法(函數(shù)),方法都包在大括號(hào)內(nèi)。
public class Person {
//屬性(字段)
String name;
//構(gòu)造方法(函數(shù))
Person(String name) {
this.name = name;
}
//方法
String getName() {
return this.name;
}
}
為了讓js代碼風(fēng)格更緊湊,把掛在prototype的方法代碼移到function Person的大括號(hào)內(nèi)。
function Person(name) {
this.name = name;
Person.prototype.getName = function() {
return this.name;
}
}
似乎很神奇,還能這么寫(xiě)啊!驗(yàn)證一下
var p1 = new Person("Jack");
var p2 = new Person("Tom");
console.log(p1.getName());//Jack
console.log(p2.getName());//Tom
沒(méi)有報(bào)錯(cuò),控制臺(tái)也正確輸出了。說(shuō)明可以這么寫(xiě),呵呵。
嗯,似乎很完美。
a 、可以通過(guò)傳參構(gòu)造對(duì)象實(shí)例
b 、對(duì)象實(shí)例都共享同一份方法不造成內(nèi)存浪費(fèi)
c 、代碼風(fēng)格也比較緊湊
但每次new一個(gè)對(duì)象的時(shí)候都會(huì)執(zhí)行
Person.prototype.getName = function() {
return this.name;
}
造成了不必要的重復(fù)的運(yùn)算。因?yàn)間etName方法掛在prototype上只需執(zhí)行一次即可。只需稍微改造下:
function Person(name) {
this.name = name;
if(Person._init==undefined) {
alert("我只執(zhí)行一次!");
Person.prototype.getName = function() {
return this.name;
}
Person._init = 1;
}
}
new兩個(gè)對(duì)象,
var p1 = new Person("Andy");//第一次new會(huì)彈出'我只執(zhí)行一次!'
var p2 = new Person("Lily");//以后new的對(duì)象不會(huì)再執(zhí)行了
a、用構(gòu)造函數(shù)來(lái)定義類(lèi)屬性(字段)
b、用原型方式來(lái)定義類(lèi)的方法。
就有了第三種方式。這種方式貌似采用的人較多。
3、綜合構(gòu)造函數(shù)/原型
復(fù)制代碼 代碼如下:
/**
* Person類(lèi):定義一個(gè)人,有個(gè)屬性name,和一個(gè)getName方法
* @param {String} name
*/
function Person(name) {
this.name = name;
}
Person.prototype.getName = function() {
return this.name;
}
這樣,即可通過(guò)構(gòu)造函數(shù)構(gòu)造不同name的人,對(duì)象實(shí)例也都共享getName方法,不會(huì)造成內(nèi)存浪費(fèi)。
但似乎這樣的代碼風(fēng)格似乎仍然沒(méi)有java的類(lèi)那么緊湊,把屬性,構(gòu)造方法(函數(shù)),方法都包在大括號(hào)內(nèi)。
復(fù)制代碼 代碼如下:
public class Person {
//屬性(字段)
String name;
//構(gòu)造方法(函數(shù))
Person(String name) {
this.name = name;
}
//方法
String getName() {
return this.name;
}
}
為了讓js代碼風(fēng)格更緊湊,把掛在prototype的方法代碼移到function Person的大括號(hào)內(nèi)。
復(fù)制代碼 代碼如下:
function Person(name) {
this.name = name;
Person.prototype.getName = function() {
return this.name;
}
}
似乎很神奇,還能這么寫(xiě)啊!驗(yàn)證一下
復(fù)制代碼 代碼如下:
var p1 = new Person("Jack");
var p2 = new Person("Tom");
console.log(p1.getName());//Jack
console.log(p2.getName());//Tom
沒(méi)有報(bào)錯(cuò),控制臺(tái)也正確輸出了。說(shuō)明可以這么寫(xiě),呵呵。
嗯,似乎很完美。
a 、可以通過(guò)傳參構(gòu)造對(duì)象實(shí)例
b 、對(duì)象實(shí)例都共享同一份方法不造成內(nèi)存浪費(fèi)
c 、代碼風(fēng)格也比較緊湊
但每次new一個(gè)對(duì)象的時(shí)候都會(huì)執(zhí)行
Person.prototype.getName = function() {
return this.name;
}
造成了不必要的重復(fù)的運(yùn)算。因?yàn)間etName方法掛在prototype上只需執(zhí)行一次即可。只需稍微改造下:
復(fù)制代碼 代碼如下:
function Person(name) {
this.name = name;
if(Person._init==undefined) {
alert("我只執(zhí)行一次!");
Person.prototype.getName = function() {
return this.name;
}
Person._init = 1;
}
}
new兩個(gè)對(duì)象,
復(fù)制代碼 代碼如下:
var p1 = new Person("Andy");//第一次new會(huì)彈出'我只執(zhí)行一次!'
var p2 = new Person("Lily");//以后new的對(duì)象不會(huì)再執(zhí)行了
相關(guān)文章
JS小框架 fly javascript framework
這幾天把工作中積累的東西整理成了一個(gè)小框架,分享給大家,希望對(duì)大家有用,也想聽(tīng)一下大家的批評(píng)2009-11-11
Javascript 類(lèi)與靜態(tài)類(lèi)的實(shí)現(xiàn)
在Javascript里,對(duì)面向?qū)ο蟛](méi)有一個(gè)直接的實(shí)現(xiàn),對(duì)于代碼方面也是非常的靈活。2010-04-04
JavaScript 設(shè)計(jì)模式 安全沙箱模式
沙箱模式常見(jiàn)于YUI3 core,它是一種采用同一構(gòu)造器(Constructor)生成彼此獨(dú)立且互不干擾(self-contained)的實(shí)例對(duì)象,而從避免污染全局對(duì)象的方法2010-09-09
JavaScript 原型繼承,學(xué)習(xí)js面向?qū)ο蟮呐笥芽梢钥纯础?/div> 2011-12-12
javascript實(shí)現(xiàn)面向?qū)ο箢?lèi)的功能書(shū)寫(xiě)技巧
經(jīng)過(guò)前段時(shí)間,學(xué)習(xí)《ajax完全自學(xué)手冊(cè)》后,才知道javascript原來(lái)還可以這么寫(xiě)。2010-03-03
DOMAssitant最新版 DOMAssistant 2.5發(fā)布
google code上的project ,值得大家學(xué)習(xí)它的類(lèi)庫(kù)2007-12-12
JavaScript面向?qū)ο笾o態(tài)與非靜態(tài)類(lèi)
使用JavaScript面向?qū)ο笸耆鲇谂既?,因?yàn)榇蟛糠謺r(shí)間我都是在無(wú)圖形界面的環(huán)境下工作,有時(shí)候就算是介入了web客戶(hù)端的工作的時(shí)候,在寫(xiě)js和ajax時(shí),最多的也只是寫(xiě)寫(xiě)function,從沒(méi)有考慮過(guò)要使用JavaScript面向?qū)ο筮@么高級(jí)的技巧。2010-02-02
學(xué)習(xí)JS面向?qū)ο蟪晒?借國(guó)慶發(fā)布個(gè)最新作品與大家交流
學(xué)習(xí)JS面向?qū)ο蟪晒鑷?guó)慶發(fā)布個(gè)最新作品與大家交流,大家可以看下。2009-10-10最新評(píng)論

