js原型和原型鏈

一、普通對象和函數(shù)對象

JavaScript中祟峦,萬物皆對象!但對象也是有區(qū)別的徙鱼,分為普通對象和函數(shù)對象宅楞。

function f1(){}; 
var f2 = function(){}; 
var f3 = new Function(‘str’,’console.log(str)’);

var o3 = new f1(); 
var o1 = {}; 
var o2 =new Object();

在上面的例子中 o1 o2 o3 為普通對象,f1 f2 f3 為函數(shù)對象袱吆。凡是通過 new Function() 創(chuàng)建的對象都是函數(shù)對象厌衙,其他的都是普通對象。f1,f2,歸根結(jié)底都是通過 new Function()的方式進行創(chuàng)建的绞绒。Function Object 也都是通過 New Function()創(chuàng)建的婶希。

二、原型對象

在JavaScript 中蓬衡,每當定義一個對象(函數(shù))時候喻杈,對象中都會包含一些預(yù)定義的屬性彤枢。其中函數(shù)對象的一個屬性就是原型對象 prototype。注:普通對象沒有prototype,但有proto屬性奕塑。

原型對象其實就是普通對象(Function.prototype除外,它是函數(shù)對象堂污,但它很特殊,他沒有prototype屬性(前面說道函數(shù)對象都有prototype屬性))龄砰。

function f1(){}; 
console.log(f1.prototype) //f1{} ;
console.log(typeof f1. prototype) //Object 
console.log(typeof Function.prototype) // Function盟猖,這個特殊 
console.log(typeof Object.prototype) // Object 
console.log(typeof Function.prototype.prototype) //undefined

從這句console.log(f1.prototype) //f1 {} 的輸出就結(jié)果可以看出,f1.prototype就是f1的一個實例對象换棚。就是在f1創(chuàng)建的時候,創(chuàng)建了一個它的實例對象并賦值給它的prototype式镐,基本過程如下:

var temp = new f1(); 
f1. prototype = temp;

所以,F(xiàn)unction.prototype為什么是函數(shù)對象就迎刃而解了固蚤,上文提到凡是new Function ()產(chǎn)生的對象都是函數(shù)對象娘汞,所以temp1是函數(shù)對象。

var temp1 = new Function (); 
Function.prototype = temp1;

那原型對象是用來做什么的呢夕玩?主要作用是用于繼承你弦。舉了例子:

var person = function(name){ 
this.name = name 
}; 
person.prototype.getName = function(){ 
return this.name; 
} ;
var zjh = new person(‘zhangjiahao’); 
zjh.getName(); //zhangjiahao

從這個例子可以看出,通過給person.prototype設(shè)置了一個函數(shù)對象的屬性燎孟,那有person實例(例中:zjh)出來的普通對象就繼承了這個屬性禽作。

三.原型鏈

JS在創(chuàng)建對象(不論是普通對象還是函數(shù)對象)的時候,都有一個叫做proto的內(nèi)置屬性揩页,用于指向創(chuàng)建它的函數(shù)對象的原型對象prototype旷偿。以上面的例子為例:

console.log(zjh.proto === person.prototype) //true

同樣,person.prototype對象也有proto屬性爆侣,它指向創(chuàng)建它的函數(shù)對象(Object)的prototype

console.log(person.prototype.proto === Object.prototype) //true

繼續(xù)萍程,Object.prototype對象也有proto屬性,但它比較特殊兔仰,為null

console.log(Object.prototype.proto) //null

我們把這個有proto串起來的直到Object.prototype.proto為null的鏈叫做原型鏈茫负。如下圖:


Paste_Image.png
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市斋陪,隨后出現(xiàn)的幾起案子朽褪,更是在濱河造成了極大的恐慌,老刑警劉巖无虚,帶你破解...
    沈念sama閱讀 211,194評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件缔赠,死亡現(xiàn)場離奇詭異,居然都是意外死亡友题,警方通過查閱死者的電腦和手機嗤堰,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,058評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人踢匣,你說我怎么就攤上這事告匠。” “怎么了离唬?”我有些...
    開封第一講書人閱讀 156,780評論 0 346
  • 文/不壞的土叔 我叫張陵后专,是天一觀的道長。 經(jīng)常有香客問我输莺,道長戚哎,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,388評論 1 283
  • 正文 為了忘掉前任嫂用,我火速辦了婚禮型凳,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘嘱函。我一直安慰自己甘畅,他們只是感情好,可當我...
    茶點故事閱讀 65,430評論 5 384
  • 文/花漫 我一把揭開白布往弓。 她就那樣靜靜地躺著疏唾,像睡著了一般。 火紅的嫁衣襯著肌膚如雪函似。 梳的紋絲不亂的頭發(fā)上荸实,一...
    開封第一講書人閱讀 49,764評論 1 290
  • 那天,我揣著相機與錄音缴淋,去河邊找鬼。 笑死泄朴,一個胖子當著我的面吹牛重抖,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播祖灰,決...
    沈念sama閱讀 38,907評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼钟沛,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了局扶?” 一聲冷哼從身側(cè)響起恨统,我...
    開封第一講書人閱讀 37,679評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎三妈,沒想到半個月后畜埋,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,122評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡畴蒲,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,459評論 2 325
  • 正文 我和宋清朗相戀三年悠鞍,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片模燥。...
    茶點故事閱讀 38,605評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡咖祭,死狀恐怖掩宜,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情么翰,我是刑警寧澤牺汤,帶...
    沈念sama閱讀 34,270評論 4 329
  • 正文 年R本政府宣布,位于F島的核電站浩嫌,受9級特大地震影響檐迟,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜固该,卻給世界環(huán)境...
    茶點故事閱讀 39,867評論 3 312
  • 文/蒙蒙 一锅减、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧伐坏,春花似錦怔匣、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,734評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至纯露,卻和暖如春剿骨,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背埠褪。 一陣腳步聲響...
    開封第一講書人閱讀 31,961評論 1 265
  • 我被黑心中介騙來泰國打工浓利, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人钞速。 一個月前我還...
    沈念sama閱讀 46,297評論 2 360
  • 正文 我出身青樓贷掖,卻偏偏與公主長得像,于是被迫代替她去往敵國和親渴语。 傳聞我的和親對象是個殘疾皇子苹威,可洞房花燭夜當晚...
    茶點故事閱讀 43,472評論 2 348

推薦閱讀更多精彩內(nèi)容

  • 聲明:此文為轉(zhuǎn)載文章,為了自己看起來方便特此重新排版驾凶,等日后看懂了再自己整理疏解牙甫,查看原文請點擊這里。 正文: J...
    辭鏡朱顏閱讀 534評論 0 1
  • 學習使用過js的人一開始都會覺得js簡單调违,這是因為js語法簡單窟哺,學習過編程語言的人,很容易掌握js的基本語法并按要...
    易則知閱讀 1,306評論 0 11
  • 在JavaScript中翰萨,原型鏈作為一個基礎(chǔ)脏答,老生長談,今天我們就來深入的解讀一下原型鏈。 本章主要講的是下面幾點...
    Devinnn閱讀 1,398評論 1 6
  • 一. 普通對象與函數(shù)對象JavaScript 中殖告,萬物皆對象阿蝶!但對象也是有區(qū)別的。分為普通對象和函數(shù)對象黄绩,Obje...
    80bb3ef13dea閱讀 1,594評論 1 10
  • javascript不包含傳統(tǒng)的類繼承模型羡洁,而是使用 prototypal 原型模型。雖然這經(jīng)常被當作是 Java...
    我是漸漸呀閱讀 162評論 0 0