JS--面向對象之原型模式創(chuàng)建對象

前言:我們創(chuàng)建的每個函數都有一個prototype屬性,這個屬性是一個指針,指向的是一個對象椿息,這個對象的作用是包含由該構造函數創(chuàng)建實例共享的屬性和方法悠反。通過字面意思來了解,prototype是通過構造函數創(chuàng)建對象實例的原型對象注盈,使用原型對象的好處就是可以讓所有的實例共享它所包含的屬性和方法晃危,這樣就不會像構造函數模式,在每次創(chuàng)建一個新的實例后都會將內部的方法重新創(chuàng)建一遍老客。如下例子圖1-1:


圖 1-1

我們可以看到在Person構造函數的prototype原型上面我們掛載了屬性和方法僚饭,我們在創(chuàng)建實例的時候纠俭,每個實例都會有相同的屬性和方法,與構造函數模式不同的是這些屬性和實例都是共享的浪慌。

什么是原型對象冤荆?

在我們創(chuàng)建每一個函數的時候,都會根據特定的規(guī)則為該函數創(chuàng)建一個prototype屬性权纤,這個屬性指向的是函數的原型對象钓简。在每個函數的prototype屬性下面也會自動獲得一個constructor(構造函數)屬性。我們可以打印一下Person.prototype.constructor汹想,如下2-1:


圖 2-1

創(chuàng)建自定義的構造函數后外邓,其原型對象只會去得到constructor屬性,其他的方法都是從Object上繼承來的古掏。當調用構造函數創(chuàng)建一個對象的時候损话,這個對象內部將會有個一指針指向的是構造函數的原型對象上,我們管這個指正叫做[[Prototype]]槽唾,在chrome等瀏覽器中打印出來顯示的是__proto__丧枪,我們要知道這個是連接實例對象和構造函數原型對象的。如圖3-1和3-2:


圖3-1



圖3-2

我們可以看到上圖中庞萍,實例對象的__proto__打印的是構造函數的原型對象拧烦,原型對象上也有一個constructor屬性,指向的是構造函數钝计。

這里我們介紹兩個方法:isPrototypeOf() ?/ ?Object.getPrototypeOf()恋博,根據英文的意思,第一個就是判斷某個原型對象是不是某個實例[[Prototype]]指向的原型對象私恬,第二個是用來獲得某個實例對象的原型對象债沮。如下圖代碼4-1和4-2:


圖 4-1


圖 4-2

之前我們不是說通過原型構造對象,所有的對象共享原型對象上的方法和屬性么本鸣,那么這是怎么共享的呢疫衩?當我們要讀取某個實例對象上的某個屬性或者方法的時候,它會在當前的對象上進行搜索永高,如果找到了那么就返回這個屬性或者方法隧土,如果沒有找到,就會搜索指針指向的原型對象命爬,在該原型對象上找到的話就會返回這個原型對象上的屬性值和方法....就這樣會一直找到Object對象上曹傀。那么反過來理解,如果我們在實例對象上新增一個同原型對象上一樣的name屬性饲宛,那么當讀取該name屬性的時候皆愉,就會讀取到當前實例對象上為止,就不會繼續(xù)往上讀取了。

這里我們再次介紹一個方法:hasOwnProperty()幕庐,該方法可以檢測一個屬性是否存在于實例中久锥,還是存在于原型中(該方法繼承于Object)。如圖5-1例子:


圖 5-1

如例子所示异剥,hasOwnproperty方法是是用來判斷屬性或者方法是不是實例屬性方法還是原型上的屬性方法瑟由。

這個我們拋出一個問題,如何定義一個屬性是在實例對象上的還是在原型對象上的冤寿?那么我們要通過in操作符hasOwnProperty()方法一起來判斷了歹苦,in操作符可以在for-in循環(huán)中使用,也可以單獨使用督怜,單獨使用的時候殴瘦,如果某個屬性在實例對象上或者原型對象上都返回TRUE,根據之前的例子可以知道号杠,hasOwnProperty()方法只會在屬性在實例上的時候才返回TRUE蚪腋,那么當操作符in返回TRUE的時候,hasOwnproperty()返回FALSE的時候姨蟋,可以判斷當前屬性是在原型對象上的屉凯,而不是在實例對象上的。

有些困了芬探,今天就復習到這里神得,明天進一步更新厘惦,更多的內容可以看js高級程序設計....

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末偷仿,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子宵蕉,更是在濱河造成了極大的恐慌酝静,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,036評論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件羡玛,死亡現場離奇詭異别智,居然都是意外死亡,警方通過查閱死者的電腦和手機稼稿,發(fā)現死者居然都...
    沈念sama閱讀 93,046評論 3 395
  • 文/潘曉璐 我一進店門薄榛,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人让歼,你說我怎么就攤上這事敞恋。” “怎么了谋右?”我有些...
    開封第一講書人閱讀 164,411評論 0 354
  • 文/不壞的土叔 我叫張陵硬猫,是天一觀的道長。 經常有香客問我,道長啸蜜,這世上最難降的妖魔是什么坑雅? 我笑而不...
    開封第一講書人閱讀 58,622評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮衬横,結果婚禮上裹粤,老公的妹妹穿的比我還像新娘。我一直安慰自己蜂林,他們只是感情好蛹尝,可當我...
    茶點故事閱讀 67,661評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著悉尾,像睡著了一般突那。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上构眯,一...
    開封第一講書人閱讀 51,521評論 1 304
  • 那天愕难,我揣著相機與錄音,去河邊找鬼惫霸。 笑死猫缭,一個胖子當著我的面吹牛,可吹牛的內容都是我干的壹店。 我是一名探鬼主播猜丹,決...
    沈念sama閱讀 40,288評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼硅卢!你這毒婦竟也來了射窒?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,200評論 0 276
  • 序言:老撾萬榮一對情侶失蹤将塑,失蹤者是張志新(化名)和其女友劉穎脉顿,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體点寥,經...
    沈念sama閱讀 45,644評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡艾疟,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,837評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了敢辩。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蔽莱。...
    茶點故事閱讀 39,953評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖戚长,靈堂內的尸體忽然破棺而出盗冷,到底是詐尸還是另有隱情,我是刑警寧澤历葛,帶...
    沈念sama閱讀 35,673評論 5 346
  • 正文 年R本政府宣布正塌,位于F島的核電站嘀略,受9級特大地震影響,放射性物質發(fā)生泄漏乓诽。R本人自食惡果不足惜帜羊,卻給世界環(huán)境...
    茶點故事閱讀 41,281評論 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望鸠天。 院中可真熱鬧讼育,春花似錦、人聲如沸稠集。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,889評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽剥纷。三九已至痹籍,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間晦鞋,已是汗流浹背蹲缠。 一陣腳步聲響...
    開封第一講書人閱讀 33,011評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留悠垛,地道東北人线定。 一個月前我還...
    沈念sama閱讀 48,119評論 3 370
  • 正文 我出身青樓,卻偏偏與公主長得像确买,于是被迫代替她去往敵國和親斤讥。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 44,901評論 2 355

推薦閱讀更多精彩內容