在JavaScript中，我們可以用instanceof操作符來(lái)判斷對(duì)象是否是某個(gè)類的實(shí)例，如果obj instaceof Class返回true，那么我們認(rèn)為obj是Class的實(shí)例，obj要么由Class創(chuàng)建，要么由Class的子類創(chuàng)建。來(lái)自Java或其他強(qiáng)類型語(yǔ)言的開(kāi)發(fā)者一定認(rèn)為如果obj instaceof Class返回true，那么obj肯定擁有Class的所有屬性。事實(shí)是這樣么?我們看下面的代碼：(斑頭雁原創(chuàng)：http://bantouyan.)

Js代碼

function ClassA()     
{     
    this.ma = 'ClassA';     
}     
ClassA.prototype.fa = function(){return 'prototype function';};     
    
function ClassB()     
{     
    this.mb = 'ClassB';     
}     
ClassB.prototype = ClassA.prototype;     
    
var obja = new ClassA();     
alert(('ma' in obja) + ' ' + obja.hasOwnProperty('ma')); //output true true     
alert(('mb' in obja) + ' ' + obja.hasOwnProperty('mb')); //output false false     
alert(('fa' in obja) + ' ' + obja.hasOwnProperty('fa')); //output true false     
alert(('fb' in obja) + ' ' + obja.hasOwnProperty('fb')); //output true false     
alert(obja instanceof ClassA);   //output true     
alert(obja instanceof ClassB);   //output true     
    
var objb = new ClassB();     
alert(('ma' in objb) + ' ' + objb.hasOwnProperty('ma')); //output false false     
alert(('mb' in objb) + ' ' + objb.hasOwnProperty('mb')); //output true true     
alert(('fa' in objb) + ' ' + objb.hasOwnProperty('fa')); //output true false     
alert(('fb' in objb) + ' ' + objb.hasOwnProperty('fb')); //output true false     
alert(objb instanceof ClassA);   //output true     
alert(objb instanceof ClassB);   //output true    

在這段代碼中，我們定義了兩個(gè)類，ClassA與ClassB，還給ClassA創(chuàng)建了原型方法fa，給ClassB創(chuàng)建了原型方法fb，并分別創(chuàng)建了對(duì)象obja與objb。直覺(jué)上，我們并不認(rèn)為ClassA與ClassB是同一個(gè)類，所以obja不是ClassB的實(shí)例，objb也不是ClassA的實(shí)例，而且obja不會(huì)擁有屬性fb，objb也不會(huì)擁有屬性fa，但是運(yùn)行結(jié)果告訴我們，JavaScript并不這樣認(rèn)為。obja與objb都擁有屬性fa與fb，它們既是ClassA的實(shí)例也是ClassB的實(shí)例。下面我們分析一下原因。(斑頭雁原創(chuàng)：http://bantouyan.)

ClassA的prototype與ClassB的prototype是同一個(gè)對(duì)象，所以給ClassA增加原型方法fa會(huì)影響到ClassB，給ClassB增加的原型方法fb也會(huì)影響到ClassA，所以obja與objb都擁有屬性fa與fb，這一點(diǎn)也比較容易理解。oba沒(méi)有ClassB的實(shí)例屬性mb但卻是ClassB的實(shí)例，objb也沒(méi)有ClassA的實(shí)例屬性ma但卻是ClassA的實(shí)例，這說(shuō)明instanceof的判斷與實(shí)例屬性無(wú)關(guān)。既然instanceof與實(shí)例屬性無(wú)關(guān)，那么它就跟原型屬性有關(guān)。事實(shí)上，JavaScript根據(jù)原型判定instanceof的運(yùn)算結(jié)果。(斑頭雁原創(chuàng)：http://bantouyan.)

我們知道同一個(gè)構(gòu)造函數(shù)所創(chuàng)建的對(duì)象與這個(gè)構(gòu)造函數(shù)共享同一個(gè)原型(只不一般不能直接訪問(wèn)過(guò)對(duì)象的原型)，而ClassA與ClassB也共享同一個(gè)原型，那么obja與objb也共享同一個(gè)原型，所以可以這樣認(rèn)為，如果對(duì)象與類共享一個(gè)原型，那么對(duì)象就是這個(gè)類的實(shí)例，instanceof運(yùn)算就返回true。下面我們看一下繼承的情況。(斑頭雁原創(chuàng)：http://bantouyan.)

Js代碼

function ClassA()     
{     
    this.ma = 'ClassA';     
}     
ClassA.prototype.fa = function(){return 'prototype function fa';};     
    
function ClassB()     
{     
    this.mb = 'ClassB';     
}     
ClassB.prototype = ClassA.prototype;     
ClassB.prototype.fb = function(){return 'prototype function fb';};     
    
function ClassC()     
{     
    this.mc = 'ClassC';     
}     
ClassC.prototype = new ClassB();     
ClassC.prototype.fc = function(){return 'prototype function fc';};     
    
var objc = new ClassC();     
alert(objc instanceof ClassB);   //output true     
alert(objc instanceof ClassA);   //output true     
alert(('ma' in objc) + ' ' + objc.hasOwnProperty('ma')); //output false false     
alert(('mb' in objc) + ' ' + objc.hasOwnProperty('mb')); //output true false     
alert(('mc' in objc) + ' ' + objc.hasOwnProperty('mc')); //output true true     
alert(('fa' in objc) + ' ' + objc.hasOwnProperty('fa')); //output true false     
alert(('fb' in objc) + ' ' + objc.hasOwnProperty('fb')); //output true false     
alert(('fc' in objc) + ' ' + objc.hasOwnProperty('fc')); //output true false    

ClassC采用原型鏈方法繼承了ClassB，所以ClassC的對(duì)象objc是ClassB的實(shí)例，但是運(yùn)行結(jié)果告訴我們，objc也是ClassA的實(shí)例。objc是ClassC的實(shí)例，所以objc與ClassC共享一個(gè)原型。ClassC的原型是ClassB的實(shí)例，所以ClassC的原型的原型與ClassB的原型是同一個(gè)原型，而ClassB與ClassA共享同一個(gè)原型，所以ClassC的原型的原型與ClassA的原型是同一個(gè)原型，即objc的原型的原型與ClassA的原型是同一個(gè)原型。由此看來(lái)，instanceof可以根據(jù)對(duì)象原型的原型，即原型鏈上的原型，判定運(yùn)算的結(jié)果，即如果類的原型與對(duì)象原型鏈上的某一個(gè)原型是同一個(gè)對(duì)象，那么instanceof運(yùn)算將返回true，否則返回false。下面我們用一段更長(zhǎng)的代碼來(lái)驗(yàn)證這個(gè)結(jié)論。(斑頭雁原創(chuàng)：http://bantouyan.)

Js代碼

function ClassA()     
{     
    this.ma = 'ClassA';     
}     
ClassA.prototype.fa = function(){return 'prototype function fa';};     
    
function ClassB()     
{     
    this.mb = 'ClassB';     
}     
ClassB.prototype = ClassA.prototype;     
ClassB.prototype.fb = function(){return 'prototype function fb';};     
    
function ClassC()     
{     
    this.mc = 'ClassC';     
}     
ClassC.prototype = new ClassB();     
ClassC.prototype.fc = function(){return 'prototype function fc';};     
    
function ClassD()     
{     
    this.md = 'ClassD';     
}     
ClassD.prototype = ClassC.prototype;     
ClassC.prototype.fd = function(){return 'prototype function fd';};     
    
function ClassE()     
{     
    this.me = 'ClassE';     
}     
ClassE.prototype = new ClassD();     
ClassE.prototype.fe = function(){return 'prototype function fe';};     
    
var obje = new ClassE();     
alert(obje instanceof ClassA);   //output true     
alert(obje instanceof ClassB);   //output true     
alert(obje instanceof ClassC);   //output true     
alert(obje instanceof ClassD);   //output true     
alert(obje instanceof ClassE);   //output true     
    
alert(('ma' in obje) + ' ' + obje.hasOwnProperty('ma')); //output false false     
alert(('mb' in obje) + ' ' + obje.hasOwnProperty('mb')); //output true false     
alert(('mc' in obje) + ' ' + obje.hasOwnProperty('mc')); //output false false     
alert(('md' in obje) + ' ' + obje.hasOwnProperty('md')); //output true false     
alert(('me' in obje) + ' ' + obje.hasOwnProperty('me')); //output true true     
    
alert(('fa' in obje) + ' ' + obje.hasOwnProperty('fa')); //output true false     
alert(('fb' in obje) + ' ' + obje.hasOwnProperty('fb')); //output true false     
alert(('fc' in obje) + ' ' + obje.hasOwnProperty('fc')); //output true false     
alert(('fd' in obje) + ' ' + obje.hasOwnProperty('fd')); //output true false     
alert(('fe' in obje) + ' ' + obje.hasOwnProperty('fe')); //output true false    

ClassA的原型與ClassB的原型共享同一個(gè)對(duì)象，ClassC的原型與ClassD的原型也共享一個(gè)對(duì)象，而ClassC是ClassB的子類，ClassE是ClassD的子類，而obje是ClassE的實(shí)例。所以obje的原型鏈的第一個(gè)原型是ClassE的原型，它是ClassD的實(shí)例，故第二個(gè)原型是ClassD的原型，也就是ClassC的原型，ClassC的原型是ClassB的實(shí)例，所以原型鏈上第三個(gè)原型是ClassB的原型，也就是ClassA的原型。所以，ClassA、ClassB、ClassC、ClassD與ClassE的原型都在對(duì)象obje的原型鏈上，所以obje是這些類的實(shí)例。這也驗(yàn)證了前面的結(jié)論，即如果類的原型與對(duì)象原型鏈上的某一個(gè)原型是同一個(gè)對(duì)象，那么instanceof運(yùn)算將返回true。雖然obje是ClassA、ClassC的實(shí)例，但是它并沒(méi)有ClassA的實(shí)例屬性ma，ClassC的實(shí)例屬性mc。(斑頭雁原創(chuàng)：http://bantouyan.)

綜合前面的論述與驗(yàn)證，我們可以得出結(jié)論，如果obj instanceof Class返回true，那么Class的原型與obj原型鏈上的某個(gè)原型是同一個(gè)對(duì)象，但這并不意味著obj擁有Class的所有實(shí)例屬性(但肯定擁有Class的所有原型屬性)。

【編輯推薦】

1. 10個(gè)超棒的HTML 5素描及繪畫(huà)設(shè)計(jì)工具
2. 學(xué)習(xí)HTML 5十佳站點(diǎn)推薦
3. 12個(gè)精妙有趣的HTML 5應(yīng)用
4. 10個(gè)令人驚奇的HTML5和JavaScript效果
5. 技術(shù)大牛談HTML 5設(shè)計(jì)原理