javascript中的每個(gè)對(duì)象都有一個(gè)內(nèi)置的屬性prototype寸癌,Javascript中對(duì)象的prototype屬性的解釋是:返回對(duì)象類型原型的引用定续。意思是是prototype屬性保存著對(duì)另一個(gè)JavaScript對(duì)象的引用稽寒,這個(gè)對(duì)象作為當(dāng)前對(duì)象的父對(duì)象匿级。
A.prototype = new B();
理解prototype不應(yīng)把它和繼承混淆幸冻。A的prototype為B的一個(gè)實(shí)例空镜,可以理解A將B中的方法和屬性全部克隆了一遍浩淘。A能使用B的方法和屬性。這里強(qiáng)調(diào)的是克隆而不是繼承吴攒≌懦可以出現(xiàn)這種情況:A的prototype是B的實(shí)例,同時(shí)B的prototype也是A的實(shí)例洼怔。
我們創(chuàng)建的每個(gè)函數(shù)都有一個(gè)prototype屬性署惯,這個(gè)屬性是一個(gè)指針,指向一個(gè)對(duì)象镣隶,這個(gè)對(duì)象的用途是包含可以由特定類型的所有實(shí)例共享的屬性和方法极谊。那么什荣,prototype就是通過(guò)調(diào)用構(gòu)造函數(shù)而創(chuàng)建的那個(gè)對(duì)象實(shí)例的原型對(duì)象。
使用原型的好處是可以讓對(duì)象實(shí)例共享它所包含的屬性和方法怀酷。也就是說(shuō)稻爬,不必在構(gòu)造函數(shù)中添加定義對(duì)象信息,而是可以直接將這些信息添加到原型中蜕依。使用構(gòu)造函數(shù)的主要問(wèn)題就是每個(gè)方法都要在每個(gè)實(shí)例中創(chuàng)建一遍桅锄。
在JavaScript中,一共有兩種類型的值,原始值和對(duì)象值。每個(gè)對(duì)象都有一個(gè)內(nèi)部屬性 prototype ,我們通常稱之為原型样眠。原型的值可以是一個(gè)對(duì)象,也可以是null友瘤。如果它的值是一個(gè)對(duì)象,則這個(gè)對(duì)象也一定有自己的原型檐束。這樣就形成了一條線性的鏈辫秧,我們稱之為原型鏈。
含義
函數(shù)可以用來(lái)作為構(gòu)造函數(shù)來(lái)使用被丧。另外只有函數(shù)才有prototype屬性并且可以訪問(wèn)到盟戏,但是對(duì)象實(shí)例不具有該屬性,只有一個(gè)內(nèi)部的不可訪問(wèn)的--proto--屬性甥桂。--proto--是對(duì)象中一個(gè)指向相關(guān)原型的神秘鏈接柿究。按照標(biāo)準(zhǔn),--proto--是不對(duì)外公開(kāi)的黄选,也就是說(shuō)是個(gè)私有屬性蝇摸,但是Firefox的引擎將他暴露了出來(lái)成為了一個(gè)共有的屬性,我們可以對(duì)外訪問(wèn)和設(shè)置办陷。
<script type="text/javascript">
var Browser = function(){};
Browser.prototype.run = function(){
alert("I'm Gecko,a kernel of firefox");
}
var Bro = new Browser();
Bro.run();
</script>
當(dāng)我們調(diào)用Bro.run()方法時(shí)貌夕,由于Bro中沒(méi)有這個(gè)方法,所以民镜,他就會(huì)去他的--proto--中去找啡专,也就是Browser.prototype,所以最終執(zhí)行了該run()方法殃恒。(在這里植旧,函數(shù)首字母大寫(xiě)的都代表構(gòu)造函數(shù),以用來(lái)區(qū)分普通函數(shù))
當(dāng)調(diào)用構(gòu)造函數(shù)創(chuàng)建一個(gè)實(shí)例的時(shí)候离唐,實(shí)例內(nèi)部將包含一個(gè)內(nèi)部指針(--proto--)指向構(gòu)造函數(shù)的prototype,這個(gè)連接存在于實(shí)例和構(gòu)造函數(shù)的prototype之間问窃,而不是實(shí)例與構(gòu)造函數(shù)之間亥鬓。
原型鏈
原型鏈:當(dāng)從一個(gè)對(duì)象那里調(diào)取屬性或方法時(shí),如果該對(duì)象自身不存在這樣的屬性或方法域庇,就會(huì)去自己關(guān)聯(lián)的prototype對(duì)象那里尋找嵌戈,如果prototype沒(méi)有覆积,就會(huì)去prototype關(guān)聯(lián)的前輩prototype那里尋找,如果再?zèng)]有則繼續(xù)查找Prototype.Prototype引用的對(duì)象熟呛,依次類推宽档,直到Prototype.….Prototype為undefined(Object的Prototype就是undefined)從而形成了所謂的“原型鏈”。
--proto--屬性
--ptoto--屬性(IE瀏覽器不支持)是實(shí)例指向原型對(duì)象的一個(gè)指針庵朝,它的作用就是指向構(gòu)造函數(shù)的原型屬性constructor吗冤,通過(guò)這兩個(gè)屬性,就可以訪問(wèn)原型里的屬性和方法了九府。
Javascript中的對(duì)象實(shí)例本質(zhì)上是由一系列的屬性組成的椎瘟,在這些屬性中,有一個(gè)內(nèi)部的不可見(jiàn)的特殊屬性—— --proto--侄旬,該屬性的值指向該對(duì)象實(shí)例的原型肺蔚,一個(gè)對(duì)象實(shí)例只擁有一個(gè)唯一的原型。
<script type="text/javascript">
function Box(){ //大寫(xiě)儡羔,代表構(gòu)造函數(shù)
Box.prototype.name = "trigkit4";//原型屬性
Box.prototype.age = "21";
Box.prototype.run = function()//原型方法
{
return this.name + this.age + 'studying';
}
}
var box1 = new Box();
var box2 = new Box();
alert(box1.constructor);//構(gòu)造屬性宣羊,可以獲取構(gòu)造函數(shù)本身,
//作用是被原型指針定位汰蜘,然后得到構(gòu)造函數(shù)本身
</script>
--proto--屬性和protype屬性的區(qū)別
prototype是function對(duì)象中專有的屬性段只。
--proto--是普通對(duì)象的隱式屬性,在new的時(shí)候鉴扫,會(huì)指向prototype所指的對(duì)象赞枕;
--ptoto--實(shí)際上是某個(gè)實(shí)體對(duì)象的屬性,而prototype則是屬于構(gòu)造函數(shù)的屬性坪创。--ptoto--只能在學(xué)習(xí)或調(diào)試的環(huán)境下使用炕婶。
原型模式的執(zhí)行流程
1.先查找構(gòu)造函數(shù)實(shí)例里的屬性和或方法,如果有莱预,就立即返回柠掂。
2.如果構(gòu)造函數(shù)的實(shí)例沒(méi)有,就去它的原型對(duì)象里找依沮,如果有涯贞,就立即返回。
原型對(duì)象的
<script type="text/javascript">
function Box(){ //大寫(xiě)危喉,代表構(gòu)造函數(shù)
Box.prototype.name = "trigkit4";//原型屬性
Box.prototype.age = "21";
Box.prototype.run = function()//原型方法
{
return this.name + this.age + 'studying';
}
}
var box1 = new Box();
alert(box1.name);//trigkit4,原型里的值
box1.name = "Lee";
alert(box1.name);//Lee,就進(jìn)原則
var box2 = new Box();
alert(box2.name);//trigkit4,原型的值宋渔,沒(méi)有被box1修改
</script>
<script type="text/javascript">
function Person(){};
Person.prototype.name = "trigkit4";
Person.prototype.say = function(){
alert("Hi");
}
var p1 = new Person();//prototype是p1和p2的原型對(duì)象
var p2 = new Person();//p2為實(shí)例化對(duì)象,其內(nèi)部有一個(gè)__proto__屬性辜限,指向Person的prototype
console.log(p1.prototype);//undefined,這個(gè)屬性是一個(gè)對(duì)象皇拣,訪問(wèn)不到
console.log(Person.prototype);//Person
console.log(Person.prototype.constructor);//原型對(duì)象內(nèi)部也有一個(gè)指針(constructor屬性)指向構(gòu)造函數(shù)
console.log(p1.__proto__);//這個(gè)屬性是一個(gè)指針指向prototype原型對(duì)象
p1.say();//實(shí)例可以訪問(wèn)到在原型對(duì)象上定義的屬性和方法
</script>