既typeof之后的另一位老朋友!
prototype也是我們的老朋友,即使不了解的人,也應(yīng)該都聽過它的大名。如果它還是您的新朋友,我估計(jì)您也是javascript的新朋友。
在咱們的第一節(jié)(深入理解javascript原型和閉包(1)——一切都是對(duì)象)中說道,函數(shù)也是一種對(duì)象。他也是屬性的集合,你也可以對(duì)函數(shù)進(jìn)行自定義屬性。
不用等咱們?nèi)ピ囼?yàn),javascript自己就先做了表率,人家就默認(rèn)的給函數(shù)一個(gè)屬性——prototype。對(duì),每個(gè)函數(shù)都有一個(gè)屬性叫做prototype。
這個(gè)prototype的屬性值是一個(gè)對(duì)象(屬性的集合,再次強(qiáng)調(diào)?。?,默認(rèn)的只有一個(gè)叫做constructor的屬性,指向這個(gè)函數(shù)本身。
如上圖,SuperType是是一個(gè)函數(shù),右側(cè)的方框就是它的原型。
原型既然作為對(duì)象,屬性的集合,不可能就只弄個(gè)constructor來玩玩,肯定可以自定義的增加許多屬性。例如這位Object大哥,人家的prototype里面,就有好幾個(gè)其他屬性。
咦,有些方法怎么似曾相似?
對(duì)!別著急,之后會(huì)讓你知道他們?yōu)楹嗡圃嘧R(shí)。
接著往下說,你也可以在自己自定義的方法的prototype中新增自己的屬性
function Fn() { }
Fn.prototype.name = '王福朋';
Fn.prototype.getYear = function () {
return 1988;
};
看到?jīng)]有,這樣就變成了
沒問題!
但是,這樣做有何用呢? ——?解決這個(gè)問題,咱們還是先說說jQuery吧。
var $div = $('div');
$div.attr('myName', '王福朋');
以上代碼中,$('div')返回的是一個(gè)對(duì)象,對(duì)象——被函數(shù)創(chuàng)建的。假設(shè)創(chuàng)建這一對(duì)象的函數(shù)是 myjQuery。它其實(shí)是這樣實(shí)現(xiàn)的。
myjQuery.prototype.attr = function () {
//……
};
$('div') = new myjQuery();
不知道大家有沒有看明白。
如果用咱們自己的代碼來演示,就是這樣
function Fn() { }
Fn.prototype.name = '王福朋';
Fn.prototype.getYear = function () {
return 1988;
};
var fn = new Fn();
console.log(fn.name);
console.log(fn.getYear());
即,F(xiàn)n是一個(gè)函數(shù),fn對(duì)象是從Fn函數(shù)new出來的,這樣fn對(duì)象就可以調(diào)用Fn.prototype中的屬性。
因?yàn)槊總€(gè)對(duì)象都有一個(gè)隱藏的屬性——“proto”,這個(gè)屬性引用了創(chuàng)建這個(gè)對(duì)象的函數(shù)的prototype。即:fn.proto === Fn.prototype
這里的"proto"成為“隱式原型”,下回繼續(xù)分解。
更多建議: