|
|
這對(duì)Java,C++甚至php的開發(fā)者來講都是難以想象的.
更糟糕的是模擬OO對(duì)于JavaScript高級(jí)程序員都有著邪惡的吸引.
因?yàn)楦蛇@個(gè)事兒超然于業(yè)務(wù)之上,有種創(chuàng)造新編程語言一般的快感,可以令I(lǐng)Q盡情揮灑.
正如前些年大家都想把自個(gè)網(wǎng)站的common.js寫成個(gè)框架一樣.直到Y(jié)UI,JQuery等等的強(qiáng)勢(shì)推出才稍有平息.
然而雖然各個(gè)框架都有對(duì)JavaScriptOO模擬,但還未到有誰誰誰可以一桶糨糊的時(shí)候吧.
或許江湖就不需要的霸主出現(xiàn),抑或大家只要等到JS2.0+就好了.
如果說可以new就是面向?qū)ο?那顯然JavaScript在這方面是非常不錯(cuò)的.
復(fù)制代碼 代碼如下:
function Person(name){
this.name = name;
}
var lenel = new person("lenel");
alert(lenel.constructor === Person);
alert(lenel instanceof Person === true);
alert(lenel instanceof Object === true);
到此為止,一切都很和諧.
對(duì)象的constructor正如字面上的意義指向構(gòu)造它的Person.
對(duì)象是構(gòu)造它的Person的一個(gè)實(shí)例(instance).
所有對(duì)象都是Object的實(shí)例,像極了Java.
JavaScript提供原型(prototype)的方式來實(shí)現(xiàn)方法拓展和繼承
復(fù)制代碼 代碼如下:
Person.prototype.getName = function(){
return this.name
};
這樣定義了之后所有對(duì)象都具有了getName的方法.
當(dāng)然也可以將寫在對(duì)象構(gòu)造時(shí)
復(fù)制代碼 代碼如下:
function Person(name){
this.name = name;
this.getName = function(){
return this.name;
};
}
但是這種做法不僅是帶來額外性能損耗這點(diǎn)瑕疵,也不僅是帶來了可以訪問私有變量的特權(quán).
它與使用prototype的寫法還會(huì)其他有不同之處,不過這不是本文的重點(diǎn).
接下來,我們想到繼承,很常見的寫法是這樣的.
復(fù)制代碼 代碼如下:
function Stuff(name,id){
this.name = name;
this.id = id;
}
Stuff.prototype = new Person();
var piupiu = new Stuff("piupiu","007");
alert(piupiu.getName());
非常好,繼承了getName方法;
考察下instanceof
復(fù)制代碼 代碼如下:
alert(piupiu instanceof Stuff === true);
alert(piupiu instanceof Person === true);
非常好,說明了Stuff和Person是有關(guān)系的.piupiu是它倆的實(shí)例,非常Java.
接下來再考察下constructor
復(fù)制代碼 代碼如下:
alert(piupiu.constructor === Stuff);//false
test(piupiu.constructor === Person);//true
問題出現(xiàn)了明明new的Stuff為啥constructor卻是Person,
在這兒將道理也是強(qiáng)詞奪理,我們只好記住結(jié)論
結(jié)論:對(duì)象的constructor屬性并非指向其構(gòu)造器,而是指向其構(gòu)造器的prototype屬性的constructor屬性
文字功底太差,自己讀過都覺得沒說清楚
放在這里:
對(duì)象piupiu的constructor屬性指向的是其構(gòu)造器Stuff的prototype屬性的constructor屬性
因?yàn)镾tuff.prototype = new Person();
所以Stuff.prototype.constructor === Person.
所以piupiu.consturctor === Person.
以上的結(jié)論不僅僅在對(duì)象繼承的時(shí)候才出現(xiàn),在定義對(duì)象時(shí)
復(fù)制代碼 代碼如下:
function Student(name){
this.name = name;
}
Student.prototype = {
getName:function(){
return this.name;
},
setName:function(name){
this.name = name;
}
}
如果方法比較多,常常會(huì)這樣寫,看起來規(guī)矩一些.
其實(shí)這種寫法同樣犧牲了constructor
復(fù)制代碼 代碼如下:
var moen = new Student("moen");
alert(moen.constructor === Student);//false
alert(moen.constructor === Object);//true
因?yàn)樵趝}相當(dāng)于new Object(),所以根據(jù)上面的結(jié)論prototype={}時(shí),constructor變了.
保衛(wèi)constructor!繼承時(shí)我們用一個(gè)循環(huán)來把父類的方法copyto子類
復(fù)制代碼 代碼如下:
function Stuff1(name,id){
this.name = name;
this.id = id;
}
for(var fn in Person.prototype){
Stuff1.prototype[fn] = Person.prototype[fn];
}
var piupiu1 = new Stuff1("piupiu1","008");
alert(piupiu1.getName() === "piupiu1");
alert(piupiu1.constructor === Stuff1);
It works!當(dāng)我們興沖沖的把父類的方法都繼承下來的時(shí)候,我們卻丟失了父子關(guān)系.
復(fù)制代碼 代碼如下:
alert(piupiu1 instanceof Stuff1 === true);//true
alert(piupiu1 instanceof Person === true);//false
顯然,我們沒有說過Stuff1是繼承至Person啊,只一個(gè)for循環(huán)能說明什么呢.
這好像是一對(duì)矛盾..顧此必失彼.
所以叻,深入使用對(duì)象的時(shí)候,甚至你一不小心,都會(huì)讓instantceof和constructor丟去字面的含義.
所以叻,在使用框架的時(shí)候,如果提供了繼承功能,如果不試不會(huì)知道你為了繼承放棄了哪個(gè).
所以叻,模擬OO時(shí)就必須要提供替代這兩個(gè)字面含義的屬性或方法的實(shí)現(xiàn),而且必須讓使用者知道!
模擬OO絕對(duì)不只這個(gè)問題,在子類方法中調(diào)用父類的同名方法,這個(gè)OO語言常見的特性,
JavaScript實(shí)現(xiàn)起來也非常困難,大師們基本都有各自的一套,只不過有些用心去做了用起來相比之下更自然些,如Base庫.
當(dāng)然可以摒棄instanceof和constructor的使用,就當(dāng)不知道有這么一回兒事兒,活兒仍可繼續(xù),死不了人的.
但如果你不是單槍匹馬作戰(zhàn),那就通知你的Partner也摒棄這對(duì)冤家吧.
類似今天這點(diǎn)事兒,老鳥們都清楚的很,但如果不是團(tuán)隊(duì)中每個(gè)人都有統(tǒng)一的認(rèn)識(shí),那就是隱患.
一個(gè)好玩兒的現(xiàn)象<<JavaScript高級(jí)程序設(shè)計(jì)>>強(qiáng)調(diào)instanceof,而<<精通JavaScript>>強(qiáng)調(diào)constructor.而各自對(duì)另一個(gè)一筆帶過或只字不提.怨念..甚深...
JavaScript技術(shù)：JavaScript constructor和instanceof,JSOO中的一對(duì)歡喜冤家，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
