本文主要和大家分享JS原型詳解說明，原型的5個(gè)規(guī)則，希望本文能幫助到大家。

• 所有的引用類型（數(shù)組，對(duì)象，函數(shù)），都具有對(duì)象特性，即可自由擴(kuò)展屬性（除了“null”）

var obj ={};obj.a=100//100var arr=[];arr.a=100//100function fn(){}
fn.a=100//100

• 所有的應(yīng)用類型，都有一個(gè)proto屬性（隱式原型），屬性值是一個(gè)普通的對(duì)象

console.log(obj.__proto__);//{constructor: ?, __defineGetter__: ?, __defineSetter__: ?, hasOwnProperty: ?, __lookupGetter__: ?, …}console.log(arr.__proto__);//[constructor: ?, concat: ?, pop: ?, push: ?, shift: ?, …]console.log(fn.__proto__);
//? () { [native code] }

• 所有的函數(shù)都有一個(gè)prototype屬性（顯式原型），屬性值也是一個(gè)普通對(duì)象

console.log(fn.prototype)
//{constructor: ?}

• 所有的引用類型的 proto屬性值指向它的構(gòu)造函數(shù)prototype屬性值（即所有引用類型的隱形原型指向他的構(gòu)造函數(shù)的顯式原型）

console.log(obj.__proto__===Object.prototype);  //true//Object是一個(gè)構(gòu)造函數(shù)

• 當(dāng)試圖得到一個(gè)對(duì)象的某個(gè)屬性時(shí)，如果這個(gè)對(duì)象本身沒有這個(gè)屬性，那么會(huì)去他的proto(即它的構(gòu)造函數(shù)的prototype)中尋找

function Foo(name,age){
    this.name = name;
}
Foo.prototype.alertName = function(){//由于Foo.prototype本身也是一個(gè)對(duì)象，而對(duì)象是可以自由擴(kuò)展屬性的
    alert(this.name);
}var f = new Foo('zhan');
f.printName = function(){
    console.log(this.name);
}
f.printName();//zhan 可以直接在這個(gè)對(duì)象中找到這個(gè)屬性f.alertName();//alert彈出zhan 這時(shí)候在這個(gè)對(duì)象本身找不到這個(gè)屬性，去Foo.prototype找,得到值var A = {n:4399};var B = function(){
    this.n = 9999;
}var C = function(){
    var n = 8888;
}
B.prototype = A;
C.prototype = A;var b = new B();var c = new C();
A.n++;
console.log(b.n);//9999console.log(c.n);//4400//先從他的實(shí)例中找，找不到去它的構(gòu)造函數(shù)的prototype中找

this

對(duì)上面測(cè)試代碼來說，永遠(yuǎn)指向?qū)ο蟊旧�，所以�?zhí)行f.alertName
可以彈出zhan

循環(huán)自身的屬性

還是對(duì)上面的測(cè)試代碼來說，如果對(duì)進(jìn)行循環(huán)的話，可以找到，name屬性，alertName屬性，printName屬性，但是一般情況下，我們只希望得到這個(gè)對(duì)象自身定義的屬性，比如：name屬性與printName屬性

var itemfor(item in f){    if(f.hasOwnProperty(item)){
        console.log(item);     // 高級(jí)瀏覽器已經(jīng)在forin中屏蔽了來自原型的屬性
     //但在這里建議大家還是加上這個(gè)判斷，保證程序的健壯性（程序?qū)τ谝?guī)范要求以外的輸入情況的處理能力）

    }
}

相關(guān)推薦：

實(shí)例解析js原型和call（）

JS原型繼承四步曲

關(guān)于js原型鏈的7篇文章推薦

以上就是JS原型詳解說明的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！