摘要:當(dāng)構(gòu)造函數(shù)創(chuàng)建的實(shí)例對(duì)象需要訪問(wèn)某個(gè)方法或?qū)傩裕@個(gè)對(duì)象又沒(méi)有該方法或?qū)傩缘臅r(shí)候,它會(huì)去原型上面去查找。實(shí)例成員表示的是實(shí)例方法和實(shí)例屬性,由構(gòu)造函數(shù)創(chuàng)建的對(duì)象,也就是實(shí)例對(duì)象提供。
經(jīng)過(guò)面試的挫折之后,繼續(xù)深入學(xué)習(xí)~~
1、原型概念的提出傳統(tǒng)的構(gòu)造函數(shù)對(duì)象包含方法時(shí),在構(gòu)造函數(shù)創(chuàng)建時(shí),就會(huì)將所有內(nèi)容重新創(chuàng)建一次,導(dǎo)致數(shù)據(jù)的重復(fù),代碼的冗余,如下所示: function Person(name, age) { this.name = name; this.age = age; this.sayHello = function () { console.log("Hello"); } } var p1 = new Person(); var p2 = new Person(); p1.sayHello === p2.sayHello // 結(jié)果為false,因?yàn)閜1,和p2的sayHello雖結(jié)構(gòu)一樣,但卻是兩個(gè)不同的對(duì)象
改良1:將方法提取到外面
function sayHello(){ console.log("Hello"); } function Person(name, age) { this.name = name; this.age = age; this.sayHello = sayHello; } var p1 = new Person(); var p2 = new Person(); p1.sayHello === p2.sayHello // 結(jié)果為true,但當(dāng)代碼量不斷增加,自定義的函數(shù)越來(lái)越多時(shí),可能會(huì)和框架中的函數(shù)發(fā)生命名沖突,也不利于代碼的維護(hù)
改良2:將方法放到構(gòu)造函數(shù)中,且避免命名沖突,原型概念出現(xiàn)
function Person(name, age) { this.name = name; this.age = age; } Person.prototype.sayHello = function (){ console.log("Hello"); } var p1 = new Person(); var p2 = new Person(); p1.sayHello === p2.sayHello // 結(jié)果為true
構(gòu)造函數(shù)一旦被創(chuàng)建,就會(huì)有一個(gè)原型屬性,也是個(gè)對(duì)象,可以往里面添加成員,每個(gè)由構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象都會(huì)默認(rèn)連接到原型屬性上去。
當(dāng)js引擎查找對(duì)象屬性時(shí),會(huì)先查找對(duì)象上是否具有該屬性,如果沒(méi)有,就會(huì)去原型屬性上去查找。
所以,什么是原型?原型是能夠?qū)崿F(xiàn)繼承的,當(dāng)構(gòu)造函數(shù)被定義的時(shí)候,原型也就被創(chuàng)建出來(lái),它可以存儲(chǔ)屬性和方法,既是一個(gè)屬性也是一個(gè)對(duì)象。當(dāng)構(gòu)造函數(shù)創(chuàng)建的實(shí)例對(duì)象需要訪問(wèn)某個(gè)方法或?qū)傩裕@個(gè)對(duì)象又沒(méi)有該方法或?qū)傩缘臅r(shí)候,它會(huì)去原型上面去查找。也就是實(shí)例對(duì)象訪問(wèn)原型對(duì)象的屬性或調(diào)用原型對(duì)象的方法,說(shuō)的通俗一點(diǎn)也就是把別的對(duì)象的方法或?qū)傩阅眠^(guò)來(lái)自己用,就是繼承,所以我們也可以說(shuō)對(duì)象繼承自其原型。
引入:屬性查找機(jī)制:對(duì)象在訪問(wèn)屬性或方法時(shí),首先在當(dāng)前對(duì)象查找,如果該對(duì)象有該屬性或方法,則停止查找,如果沒(méi)有,則去原型中查找,如果原型沒(méi)有,則去原型的原型中查找,直到原型的頂部,如果還是沒(méi)有,則返回undefined(屬性)或 xxx is not a function(方法)
2、一些相關(guān)概念 ① 面向?qū)ο蟮南嚓P(guān)概念類class:在js中就是構(gòu)造函數(shù)
實(shí)例(instance)與對(duì)象(object)
實(shí)例是指某個(gè)構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象,我們稱之為xxx構(gòu)造函數(shù)的實(shí)例;
鍵值對(duì)與屬性和方法
在js中,鍵值對(duì)的集合稱之為對(duì)象
如果數(shù)據(jù)是值,該鍵值對(duì)為屬性prototype
如果數(shù)據(jù)是函數(shù),該鍵值對(duì)為方法method
父類與子類
js中沒(méi)有class的概念,由C++引申過(guò)來(lái),父類又稱基類,子類又稱派生類
js中稱為父對(duì)象、子對(duì)象
prototype針對(duì)構(gòu)造函數(shù),稱為“原型屬性”
prototype針對(duì)構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象,稱為“原型對(duì)象”
原型屬性與原型對(duì)象的關(guān)系:
!!構(gòu)造函數(shù)的原型屬性和構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象的原型對(duì)象,是一個(gè)東西
!!構(gòu)造函數(shù)的原型屬性所指向的對(duì)象,與構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象(實(shí)例對(duì)象),這是兩個(gè)不同的對(duì)象(快繞暈了)
構(gòu)造函數(shù)創(chuàng)建出來(lái)的對(duì)象(實(shí)例對(duì)象)繼承構(gòu)造函數(shù)的原型屬性和原型對(duì)象
4、原型的使用利用對(duì)象的動(dòng)態(tài)特性:在原來(lái)的對(duì)象上添加成員
構(gòu)造函數(shù).prototype.xxx = ccc;
直接替換:重新創(chuàng)建一個(gè)對(duì)象
構(gòu)造函數(shù).prototype = {};
通過(guò) proto 允許實(shí)例對(duì)象直接訪問(wèn)原型,通常用于在調(diào)試中查看原型的成員(實(shí)例對(duì)象不允許修改原型)
6、原型的結(jié)構(gòu)有一個(gè)默認(rèn)屬性:constructor => 構(gòu)造器,表示該原型是與什么構(gòu)造函數(shù)聯(lián)系起來(lái)的
∴ 構(gòu)造函數(shù)通過(guò) prototype 的屬性訪問(wèn)原型,原型可以通過(guò) constructor 訪問(wèn)構(gòu)造函數(shù)
簡(jiǎn)單繼承:將別的對(duì)象的方法或?qū)傩灾苯幽眠^(guò)來(lái),加到自己身上,于是我就有了該方法或?qū)傩浴?> 簡(jiǎn)單粗暴,層次清晰
利用原型繼承:不需要添加成員,只要原型具有,我便有了。=> 提高復(fù)用性
混合式繼承:將方法或?qū)傩岳没烊氲姆椒ǎ拥綐?gòu)造函數(shù)原型中,實(shí)例對(duì)象即有了指定的方法或?qū)傩浴?/p> 8、靜態(tài)成員和實(shí)例成員的概念
該概念由其他面向?qū)ο蟮恼Z(yǔ)言引入。
靜態(tài)成員表示的是靜態(tài)方法和靜態(tài)屬性,由構(gòu)造函數(shù)提供。
實(shí)例成員表示的是實(shí)例方法和實(shí)例屬性,由構(gòu)造函數(shù)創(chuàng)建的對(duì)象,也就是實(shí)例對(duì)象提供。
9、小結(jié)什么是原型?
如何使用原型?
什么是原型繼承? => 實(shí)例對(duì)象默認(rèn)連接到原型中,可以繼承原型的方法和屬性,也可以自己給原型賦值
如何實(shí)現(xiàn)? => 混合式繼承
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/100087.html
摘要:是完全的面向?qū)ο笳Z(yǔ)言,它們通過(guò)類的形式組織函數(shù)和變量,使之不能脫離對(duì)象存在。而在基于原型的面向?qū)ο蠓绞街校瑢?duì)象則是依靠構(gòu)造器利用原型構(gòu)造出來(lái)的。 JavaScript 函數(shù)式腳本語(yǔ)言特性以及其看似隨意的編寫(xiě)風(fēng)格,導(dǎo)致長(zhǎng)期以來(lái)人們對(duì)這一門(mén)語(yǔ)言的誤解,即認(rèn)為 JavaScript 不是一門(mén)面向?qū)ο蟮恼Z(yǔ)言,或者只是部分具備一些面向?qū)ο蟮奶卣鳌1疚膶⒒貧w面向?qū)ο蟊疽猓瑥膶?duì)語(yǔ)言感悟的角度闡述為什...
摘要:對(duì)象重新認(rèn)識(shí)面向?qū)ο竺嫦驅(qū)ο髲脑O(shè)計(jì)模式上看,對(duì)象是計(jì)算機(jī)抽象現(xiàn)實(shí)世界的一種方式。除了字面式聲明方式之外,允許通過(guò)構(gòu)造器創(chuàng)建對(duì)象。每個(gè)構(gòu)造器實(shí)際上是一個(gè)函數(shù)對(duì)象該函數(shù)對(duì)象含有一個(gè)屬性用于實(shí)現(xiàn)基于原型的繼承和共享屬性。 title: JS對(duì)象(1)重新認(rèn)識(shí)面向?qū)ο? date: 2016-10-05 tags: JavaScript 0x00 面向?qū)ο?從設(shè)計(jì)模式上看,對(duì)象是...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過(guò)對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來(lái)。注意中,對(duì)象一定是通過(guò)類的實(shí)例化來(lái)的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過(guò)對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來(lái)。注意中,對(duì)象一定是通過(guò)類的實(shí)例化來(lái)的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:很多情況下,通常一個(gè)人類,即創(chuàng)建了一個(gè)具體的對(duì)象。對(duì)象就是數(shù)據(jù),對(duì)象本身不包含方法。類是相似對(duì)象的描述,稱為類的定義,是該類對(duì)象的藍(lán)圖或原型。在中,對(duì)象通過(guò)對(duì)類的實(shí)體化形成的對(duì)象。一類的對(duì)象抽取出來(lái)。注意中,對(duì)象一定是通過(guò)類的實(shí)例化來(lái)的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 馬上就要到七夕了,離年底老媽老爸...
摘要:基于原型的面向?qū)ο笤诨谠偷恼Z(yǔ)言中如并不存在這種區(qū)別它只有對(duì)象不論是構(gòu)造函數(shù),實(shí)例,原型本身都是對(duì)象。允許動(dòng)態(tài)地向單個(gè)的對(duì)象或者整個(gè)對(duì)象集中添加或移除屬性。為了解決以上兩個(gè)問(wèn)題,提供了構(gòu)造函數(shù)創(chuàng)建對(duì)象的方式。 showImg(https://segmentfault.com/img/remote/1460000013229218); 一. 重新認(rèn)識(shí)面向?qū)ο?1. JavaScript...
閱讀 2447·2021-10-09 09:44
閱讀 3819·2021-09-22 15:43
閱讀 2935·2021-09-02 09:47
閱讀 2562·2021-08-12 13:29
閱讀 3881·2019-08-30 15:43
閱讀 1691·2019-08-30 13:06
閱讀 2197·2019-08-29 16:07
閱讀 2757·2019-08-29 15:23