簡單總結面向對象編程的2種創(chuàng)建類的最常用模式

本篇不講任何推導過程裹唆,直接說結論。

構造函數常識

每定義一個函數,引擎就自動定義了該函數的prototype屬性和該函數的原型對象舍咖,然后讓prototype屬性指向這個原型對象。

現在我們知道函數自帶prototype屬性和原型對象就行了锉桑。

引擎給原型對象搞了一個constructor屬性排霉,指向函數本身。別問為什么民轴。

function Foo() {}
console.log(Foo.prototype); // prototype屬性攻柠,指向Foo的原型對象
console.log(Foo.prototype.constructor === Foo); // true

實例對象常識

把Foo函數new一下子,出來個新對象(叫實例對象)后裸,這個對象也自帶一個屬性叫__proto__瑰钮,是不是跟prototype很像?沒錯微驶,__proto__屬性也指向Foo的原型對象浪谴。

JS引擎給__proto__屬性也鼓搗了一個constructor屬性,指向函數本身因苹。別問為什么苟耻。

function Foo() {}
var a = new Foo();
console.log(a.__proto__); // a的__proto__屬性,也指向Foo的原型對象
console.log(a.__proto__.constructor === Foo); // true

先這么記憶:
Foo.prototype.constructor === Foo
a.proto.constructor === Foo

原型對象常識

原型對象可以定義屬性和方法扶檐,當new出實例對象之后凶杖,對象就可以用這些屬性和方法。

function Foo() {}
Foo.prototype.name = 'zhangsan';
Foo.prototype.sayName = function() {return this.name};
var a = new Foo();
console.log(a.name); // zhangsan
console.log(a.sayName()); // zhangsan
function Foo() {}
Foo.prototype = { // 一次性定義所有屬性和方法
    name: 'zhangsan',
    sayName: function() {return this.name}
};
var a = new Foo();
console.log(a.name); // zhangsan
console.log(a.sayName()); // zhangsan

定義對象的普遍方式:混合構造函數模式和原型模式

定義對象的方式蘸秘,前輩們研究了很久官卡,最普遍、最簡單醋虏、較為科學的方式就是混合構造函數模式和原型模式寻咒。也就是,屬性定義在構造函數里颈嚼,方法定義在原型對象上毛秘,另外在原型對象上重置constructor屬性指向構造函數:

function Foo() {
    this.name = 'zhangsan';
}
Foo.prototype = {
    constructor: Foo,
    sayName: function() {
        return this.name
    }
};
var a = new Foo();
console.log(a.name); // zhangsan
console.log(a.sayName()); // zhangsan

定義對象的第二普遍方式:動態(tài)原型模式

批評混合的構造函數/原型方式的人認為,在構造函數內部找屬性,在其外部找方法的做法不合邏輯叫挟。因此艰匙,他們設計了動態(tài)原型方法,以提供更友好的編碼風格抹恳。

動態(tài)原型方法的基本想法與混合的構造函數/原型方式相同员凝,即在構造函數內定義非函數屬性,而函數屬性則利用原型屬性定義奋献。唯一的區(qū)別是賦予對象方法的位置健霹。

function Foo() {
    this.name = 'zhangsan';
    if ( typeof this.sayName !== 'function' ) {
        Foo.prototype.sayName = function() {
            return this.name;
        }
    }

}

var a = new Foo();
console.log(a.name); // zhangsan
console.log(a.sayName()); // zhangsan
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市瓶蚂,隨后出現的幾起案子糖埋,更是在濱河造成了極大的恐慌,老刑警劉巖窃这,帶你破解...
    沈念sama閱讀 221,273評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件瞳别,死亡現場離奇詭異,居然都是意外死亡杭攻,警方通過查閱死者的電腦和手機祟敛,發(fā)現死者居然都...
    沈念sama閱讀 94,349評論 3 398
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來朴上,“玉大人垒棋,你說我怎么就攤上這事』驹祝” “怎么了叼架?”我有些...
    開封第一講書人閱讀 167,709評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長衣撬。 經常有香客問我乖订,道長,這世上最難降的妖魔是什么具练? 我笑而不...
    開封第一講書人閱讀 59,520評論 1 296
  • 正文 為了忘掉前任乍构,我火速辦了婚禮,結果婚禮上扛点,老公的妹妹穿的比我還像新娘哥遮。我一直安慰自己,他們只是感情好陵究,可當我...
    茶點故事閱讀 68,515評論 6 397
  • 文/花漫 我一把揭開白布眠饮。 她就那樣靜靜地躺著,像睡著了一般铜邮。 火紅的嫁衣襯著肌膚如雪仪召。 梳的紋絲不亂的頭發(fā)上寨蹋,一...
    開封第一講書人閱讀 52,158評論 1 308
  • 那天,我揣著相機與錄音扔茅,去河邊找鬼已旧。 笑死,一個胖子當著我的面吹牛召娜,可吹牛的內容都是我干的运褪。 我是一名探鬼主播,決...
    沈念sama閱讀 40,755評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼玖瘸,長吁一口氣:“原來是場噩夢啊……” “哼吐句!你這毒婦竟也來了?” 一聲冷哼從身側響起店读,我...
    開封第一講書人閱讀 39,660評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎攀芯,沒想到半個月后屯断,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 46,203評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡侣诺,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 38,287評論 3 340
  • 正文 我和宋清朗相戀三年殖演,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片年鸳。...
    茶點故事閱讀 40,427評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡趴久,死狀恐怖,靈堂內的尸體忽然破棺而出搔确,到底是詐尸還是另有隱情彼棍,我是刑警寧澤,帶...
    沈念sama閱讀 36,122評論 5 349
  • 正文 年R本政府宣布膳算,位于F島的核電站座硕,受9級特大地震影響,放射性物質發(fā)生泄漏涕蜂。R本人自食惡果不足惜华匾,卻給世界環(huán)境...
    茶點故事閱讀 41,801評論 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望机隙。 院中可真熱鬧蜘拉,春花似錦、人聲如沸有鹿。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,272評論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽印颤。三九已至您机,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背际看。 一陣腳步聲響...
    開封第一講書人閱讀 33,393評論 1 272
  • 我被黑心中介騙來泰國打工咸产, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人仲闽。 一個月前我還...
    沈念sama閱讀 48,808評論 3 376
  • 正文 我出身青樓脑溢,卻偏偏與公主長得像,于是被迫代替她去往敵國和親赖欣。 傳聞我的和親對象是個殘疾皇子屑彻,可洞房花燭夜當晚...
    茶點故事閱讀 45,440評論 2 359

推薦閱讀更多精彩內容