摘要:這個(gè)做法借鑒自其他語(yǔ)言,主要是為了區(qū)別于中的其他函數(shù)因?yàn)闃?gòu)造函數(shù)本身也是函數(shù),只不過可以用來創(chuàng)建對(duì)象而已。
面向?qū)ο蟮恼Z(yǔ)言有一個(gè)標(biāo)志,那就是它們都有類的概念,而通過類可以創(chuàng)建任意多個(gè)具有相同屬性和方法的對(duì)象
創(chuàng)建對(duì)象雖然Object構(gòu)造函數(shù)或者對(duì)象字面量都可以用來創(chuàng)建單個(gè)對(duì)象,但這些方式有個(gè)明顯的缺點(diǎn):使用同一個(gè)接口創(chuàng)建很多對(duì)象,會(huì)產(chǎn)生大量重復(fù)代碼(為什么或產(chǎn)生大量重復(fù)的代碼?)。
工廠模式function createPerson(name, age, job){ var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function(){ alert(this.name); }; return o; } var person1 = createPerson("Nicholas", 29, "Software Engineer"); var person2 = createPerson("Greg", 27, "Doctor");
工廠模式的特點(diǎn):解決了創(chuàng)建多個(gè)相似對(duì)象的問題,但卻沒有解決對(duì)象識(shí)別的問題(即怎么知道一個(gè)對(duì)象的類型);
構(gòu)造函數(shù)模式構(gòu)造函數(shù)始終都應(yīng)該以一個(gè)大寫字母開頭,而非構(gòu)造函數(shù)則應(yīng)該以一個(gè)小寫字母開頭。這個(gè)做法借鑒自其他 OO 語(yǔ)言,主要是為了區(qū)別于 ECMAScript中的其他函數(shù);因?yàn)闃?gòu)造函數(shù)本身也是函數(shù),只不過可以用來創(chuàng)建對(duì)象而已。
function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.sayName = function(){ alert(this.name); }; } var person1 = new Person("Nicholas", 29, "Software Engineer"); var person2 = new Person("Greg", 27, "Doctor");
要?jiǎng)?chuàng)建 Person 的新實(shí)例,必須使用 new 操作符。這中方式調(diào)用構(gòu)造函數(shù)實(shí)際上回會(huì)經(jīng)歷4個(gè)步驟
創(chuàng)建一個(gè)對(duì)象
將構(gòu)造函數(shù)的作用域賦給新對(duì)象(因此this就指向了這個(gè)新對(duì)象)
執(zhí)行構(gòu)造函數(shù)中的代碼(為這個(gè)新對(duì)象添加屬性)
返回新對(duì)象
缺點(diǎn): 每個(gè)方法都要在每個(gè)實(shí)例上重新創(chuàng)建一遍。
原型模式每一個(gè)函數(shù)都有一個(gè) prototype(原型)屬性,這個(gè)屬性是一個(gè)指針,指向一個(gè)對(duì)象,而這個(gè)對(duì)象的用途是包含可以有特定類型的所有實(shí)例共享的屬性和方法。
function Person(){ } Person.prototype.name = "Nicholas"; Person.prototype.age = 29; Person.prototype.job = "Software Engineer"; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = new Person(); person1.sayName(); //"Nicholas" var person2 = new Person(); person2.sayName(); //"Nicholas" alert(person1.sayName == person2.sayName); //true
新對(duì)象的這些屬性和方法是由所有實(shí)例共享的。換句話說,person1 和 person2 訪問的都是同一組屬性和同一個(gè) sayName()函數(shù)
理解原型對(duì)象構(gòu)造函數(shù)、原型和實(shí)例的關(guān)系:每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象(prototype屬性),原型對(duì)象都包含一個(gè)指向構(gòu)造函數(shù)的指針(constructor(構(gòu)造函數(shù))屬性),而實(shí)例有包含一個(gè)指向原型對(duì)象的內(nèi)部指針([[Prototype]]、Firefox、Safari 和 Chrome 在每個(gè)對(duì)象上都支持一個(gè)屬性__proto__)
更簡(jiǎn)單的原型語(yǔ)法function Person(){ } Person.prototype = { constructor : Person, // name : "Nicholas", age : 29, job: "Software Engineer", sayName : function () { alert(this.name); } };
本質(zhì)上完全重寫了默認(rèn)的 prototype 對(duì)象,因此 constructor 屬性也就變成了新對(duì)象的 constructor 屬性(指向 Object 構(gòu)造函數(shù)),不再指向 Person 函數(shù)。所以需要手動(dòng)設(shè)置 constructor 屬性,并將它的值設(shè)置為 Person,確保通過該屬性能夠訪問到適當(dāng)?shù)闹怠?/p> 原型與in操作符 原型的動(dòng)態(tài)性 原生對(duì)象的原型
原型模式的重要性不僅體現(xiàn)在創(chuàng)建自定義類型方面,就連所有原生的引用類型,都是采用這種模式創(chuàng)建的。所有原生引用類型(Object、Array、String等)都在期構(gòu)造函數(shù)的原型定義了方法。例如,在Array.prototype中可以找到sort()方法,而在String.prototype中可以找到substring()方法。
alert(typeof Array.prototype.sort); //"function" alert(typeof String.prototype.substring); //"function"
通過原生對(duì)象的原型,不僅可以取得所有默認(rèn)方法的引用,而且也可以定義新方法??梢韵裥薷淖远x對(duì)象的原型一樣修改原型對(duì)象的原型,因此可以隨時(shí)添加方法。下面的代碼就給基本包裝類型String添加了一個(gè)名為 startsWith()的方法。
String.prototype.startsWith = function (text) { return this.indexOf(text) == 0; }; var msg = "Hello world!"; alert(msg.startsWith("Hello")); //true原型對(duì)象的問題
缺點(diǎn):
因?yàn)槭÷粤藶闃?gòu)造函數(shù)傳遞初始化參數(shù)這一環(huán)節(jié),結(jié)果所有在默認(rèn)情況下都將取得相同的屬性值
最大問題是由其共享的本性所導(dǎo)致的。
原型中所有屬性是被很多實(shí)例共享的,這種共享對(duì)于函數(shù)非常合適。對(duì)于那些包含基本值的屬性倒也說的過去,畢竟(如前面的例子所示),通過在實(shí)例上添加同一個(gè)同名屬性,可以隱藏在原型中的對(duì)應(yīng)屬性。然而,對(duì)于包含引用類型值的屬性來說,問題就比較突出了。
function Person(){ } Person.prototype = { constructor: Person, name : "Nicholas", age : 29, job : "Software Engineer", friends : ["Shelby", "Court"], sayName : function () { alert(this.name); } }; var person1 = new Person(); var person2 = new Person(); person1.friends.push("Van"); alert(person1.friends); //"Shelby,Court,Van" alert(person2.friends); //"Shelby,Court,Van" alert(person1.friends === person2.friends); //true繼承 原型鏈
基本思想:利用原型讓一個(gè)引用類型繼承另一個(gè)類型的屬性和方法。
function SuperType(){ this.property = true; } SuperType.prototype.getSuperValue = function(){ return this.property; }; function SubType(){ this.subproperty = false; } //繼承了 SuperType SubType.prototype = new SuperType(); SubType.prototype.getSubValue = function (){ return this.subproperty; }; var instance = new SubType(); alert(instance.getSuperValue()); //true
原型的搜索機(jī)制:當(dāng)以讀取模式方式訪問一個(gè)實(shí)例屬性時(shí),首先會(huì)在實(shí)例中搜索該屬性。如果沒有找到改屬性,則會(huì)繼續(xù)搜索實(shí)例的原型。在通過原型鏈實(shí)現(xiàn)繼承的情況,搜索過程就得以沿著原型鏈繼續(xù)向上。在找不到屬性或方法的情況下,搜索過程是要一環(huán)一環(huán)地前行到原型鏈末端才會(huì)停下來。
默認(rèn)的原型我們引用類型默認(rèn)都繼承了Object,而這個(gè)繼承也是通過原型鏈實(shí)現(xiàn)的。大家要記住,所有函數(shù)的默認(rèn)原型都是Object的實(shí)例,因此默認(rèn)原型都會(huì)包含一個(gè)內(nèi)部指針,指向Object.prototype。這也正式所有自定義類型都會(huì)繼承toString()、valueOf()等默認(rèn)方法的根本原因。
完整的原型鏈:
主要問題來自于包含引用類型的原型(引用類型值的原型屬性會(huì)被所有實(shí)例共享)。在通過原型來實(shí)現(xiàn)繼承時(shí),原型實(shí)際上回變成另一個(gè)類型的實(shí)例。于是,原先的實(shí)例屬性也就順理成章地變成了現(xiàn)在的原型屬性了。
function SuperType(){ this.colors = ["red", "blue", "green"]; } function SubType(){ } //繼承了 SuperType SubType.prototype = new SuperType(); var instance1 = new SubType(); instance1.colors.push("black"); alert(instance1.colors); //"red,blue,green,black" var instance2 = new SubType(); alert(instance2.colors); //"red,blue,green,black"
原型鏈的第二個(gè)問題是:在創(chuàng)建子類型的實(shí)例時(shí),不能向超類型的構(gòu)造函數(shù)中傳遞參數(shù)。實(shí)際上,應(yīng)該說是沒有辦法在不影響所有對(duì)象實(shí)例的情況下,給超類型的構(gòu)造函數(shù)傳遞參數(shù)。有鑒于此,在加上前面剛剛討論過的由于原型中包含引用類型值所帶來的問題,實(shí)踐中很少會(huì)多帶帶使用原型鏈。
借用構(gòu)造函數(shù)基本思想:在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)。通過apply()和call()方法也可以在(將來)新創(chuàng)建的對(duì)子那個(gè)上執(zhí)行構(gòu)造函數(shù)
function SuperType(){ this.colors = ["red", "blue", "green"]; } function SubType(){ //繼承了 SuperType SuperType.call(this); } var instance1 = new SubType(); instance1.colors.push("black"); alert(instance1.colors); //"red,blue,green,black" var instance2 = new SubType(); alert(instance2.colors); //"red,blue,green"優(yōu)點(diǎn)
傳遞參數(shù).借用構(gòu)造函數(shù)可以在子類型構(gòu)造函數(shù)中向超類型構(gòu)造函數(shù)傳遞參數(shù)
function SuperType(name){ this.name = name; } function SubType(){ //繼承了 SuperType,同時(shí)還傳遞了參數(shù) SuperType.call(this, "Nicholas"); //實(shí)例屬性 this.age = 29; } var instance = new SubType(); alert(instance.name); //"Nicholas"; alert(instance.age); //29問題
構(gòu)造函數(shù)存在的問題——方法都在構(gòu)造函數(shù)定義,因此函數(shù)就無法復(fù)用。而且在超類型的原型中定義方法,對(duì)子類型而言也是不可見的,結(jié)果所有類型都只能在使用構(gòu)造函數(shù)模式
組合繼承組合繼承:有時(shí)候也叫偽經(jīng)典繼承,指的是將原型鏈和借用構(gòu)造函數(shù)的技術(shù)組合到一塊,從而發(fā)揮二者之長(zhǎng)的一種繼承模式。
基本思想: 使用原型鏈實(shí)現(xiàn)對(duì)原型屬性和方法的繼承,而通過借用構(gòu)造函數(shù)來實(shí)現(xiàn)對(duì)實(shí)例屬性的繼承。這樣,即通過在原型上定義方法實(shí)現(xiàn)了函數(shù)復(fù)用,又能夠保證每個(gè)實(shí)例都有它自己的屬性。
function SuperType(name){ this.name = name; this.colors = ["red", "blue", "green"]; } SuperType.prototype.sayName = function(){ alert(this.name); }; function SubType(name, age){ //繼承屬性 SuperType.call(this, name); this.age = age; } //繼承方法 SubType.prototype = new SuperType(); SubType.prototype.constructor = SubType; SubType.prototype.sayAge = function(){ alert(this.age); }; var instance1 = new SubType("Nicholas", 29); instance1.colors.push("black"); alert(instance1.colors); //"red,blue,green,black" instance1.sayName(); //"Nicholas"; instance1.sayAge(); //29 var instance2 = new SubType("Greg", 27); alert(instance2.colors); //"red,blue,green" instance2.sayName(); //"Greg"; instance2.sayAge(); //27
instanceof 和 isPrototypeOf()也能夠用于識(shí)別基于組合繼承創(chuàng)建的對(duì)象
小結(jié)ECMAScript 支持面向?qū)ο螅∣O)編程,但不使用類或者接口。對(duì)象可以在代碼執(zhí)行過程中創(chuàng)建和增強(qiáng),因此具有動(dòng)態(tài)性而非嚴(yán)格定義的實(shí)體。在沒有類的情況下,可以采用下列模式創(chuàng)建對(duì)象。
工廠模式,使用簡(jiǎn)單的函數(shù)創(chuàng)建對(duì)象,為對(duì)象添加屬性和方法,然后返回對(duì)象。這個(gè)模式后來被構(gòu)造函數(shù)模式所取代。
構(gòu)造函數(shù)模式,可以創(chuàng)建自定義引用類型,可以像創(chuàng)建內(nèi)置對(duì)象實(shí)例一樣使用new操作符。不過,構(gòu)造函數(shù)模式也有缺點(diǎn),即它的每個(gè)成員都無法得到復(fù)用,包括函數(shù)。由于函數(shù)可以不局限于任何對(duì)象(即與對(duì)象具有松散耦合的特點(diǎn)),因此沒有理由在多個(gè)對(duì)象間共享函數(shù)。
原型模式,使用構(gòu)造函數(shù)的prototype屬性來指定那些應(yīng)該共享的屬性和方法。組合使用構(gòu)造函數(shù)模式和原型模式時(shí),使用構(gòu)造函數(shù)定義實(shí)例屬性,而使用原型定義共享的屬性和方法。
JavaScript主要通過原型鏈實(shí)現(xiàn)繼承。原型鏈的構(gòu)建是通過講一個(gè)類型的實(shí)例賦值給另一個(gè)構(gòu)造函數(shù)的原型實(shí)現(xiàn)的。這樣,子類型就能夠訪問超類型的所有屬性和方法,這一點(diǎn)與基于類的繼承很相似。原型鏈的問題是對(duì)象實(shí)例共享所有繼承的屬性和方法,因此不適宜多帶帶使用。解決這個(gè)問題的技術(shù)是借用構(gòu)造函數(shù),即在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)。這樣就可以做到每個(gè)實(shí)例都具有自己的屬性,同時(shí)還能保只使用構(gòu)造函數(shù)模式來定義類型。使用最多的繼承模式是組合繼承,這種模式使用原型鏈繼承共享的屬性和方法,而通過借用構(gòu)造函數(shù)繼承實(shí)例屬性。
此外,還存在下列可供選擇的繼承模式。
原型式繼承,可以在不必預(yù)先定義構(gòu)造函數(shù)的情況下實(shí)現(xiàn)繼承,其本質(zhì)是執(zhí)行對(duì)給定對(duì)象的淺復(fù)制。而復(fù)制得到的副本還可以得到進(jìn)一步改造。
寄生式繼承,與原型式繼承非常相似,也是基于對(duì)象或某些寫信創(chuàng)建一個(gè)對(duì)象,然后增強(qiáng)對(duì)象。最后返回對(duì)象。為了解決組合繼承模式由于多次調(diào)用超類型構(gòu)造函數(shù)而導(dǎo)致的低效率問題,可以將這個(gè)模式與組合繼承一起使用。
寄生組合式繼承,集寄生式繼承和組合繼承的有點(diǎn)與一身,是實(shí)現(xiàn)基于類型繼承的最有效方式
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://www.ezyhdfw.cn/yun/103549.html
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來。注意中,對(duì)象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來。注意中,對(duì)象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來。注意中,對(duì)象一定是通過類的實(shí)例化來的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:說到底面向?qū)ο蟛攀浅绦蛘Z(yǔ)言的根本。其實(shí)面向?qū)ο缶幊陶f的就是自定義對(duì)象。里并沒有類的概念,所以嚴(yán)格上來講這是個(gè)假的面向?qū)ο罄锏拿嫦驅(qū)ο缶幊态F(xiàn)在好了,終于聽到別人鄙視我們了,給我們提供了類這個(gè)概念,其實(shí)是向傳統(tǒng)語(yǔ)言更靠齊了。 通過前兩篇文章,我們了解了對(duì)象的概念以及面向?qū)ο罄锏南嚓P(guān)概念等知識(shí),那前面說了對(duì)象分類里的前兩種,這篇文章要詳細(xì)去說第三種自定義對(duì)象,那真正的好戲這就來了! 面向?qū)ο?..
摘要:面向?qū)ο蟮乃枷胍呀?jīng)涉及到軟件開發(fā)的各個(gè)方面。面向?qū)ο蟮某绦蛟O(shè)計(jì)是將數(shù)據(jù)成員和屬于此數(shù)據(jù)的操作方法放在同一實(shí)體或?qū)ο笾?,就是封裝。 面向?qū)ο? 什么是面向?qū)ο?..
摘要:用代碼可以這樣描述安全到達(dá)國(guó)外面向過程既然說了面向?qū)ο?,那么與之對(duì)應(yīng)的就是面向過程。小結(jié)在這篇文章中,介紹了什么是面向?qū)ο蠛兔嫦蜻^程,以及中對(duì)象的含義。 這是 javascript 面向?qū)ο蟀鎵K的第一篇文章,主要講解對(duì)面向?qū)ο笏枷氲囊粋€(gè)理解。先說說什么是對(duì)象,其實(shí)這個(gè)還真的不好說。我們可以把自己當(dāng)成一個(gè)對(duì)象,或者過年的時(shí)候相親,找對(duì)象,那么你未來的老婆也是一個(gè)對(duì)象。我們就要一些屬性,比...
閱讀 2114·2023-04-25 16:53
閱讀 1509·2021-10-13 09:39
閱讀 673·2021-09-08 09:35
閱讀 1692·2019-08-30 13:03
閱讀 2186·2019-08-30 11:06
閱讀 1889·2019-08-30 10:59
閱讀 3247·2019-08-29 17:00
閱讀 2342·2019-08-23 17:55