小編給大家分享一下js原型鏈,繼承和promis是什么,希望大家閱讀完這篇文章后大所收獲,下面讓我們一起去探討吧!
創(chuàng)新互聯(lián)主要從事成都網(wǎng)站建設(shè)、成都網(wǎng)站制作、網(wǎng)頁設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)永興,十余年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):18980820575開局一張圖
prototype
每個(gè)函數(shù)都有一個(gè)prototype屬性,被稱為顯示原型
2._proto _
每個(gè)實(shí)例對象都會(huì)有_proto _屬性,其被稱為隱式原型
每一個(gè)實(shí)例對象的隱式原型_proto _屬性指向自身構(gòu)造函數(shù)的顯式原型prototype
constructor
每個(gè)prototype原型都有一個(gè)constructor屬性,指向它關(guān)聯(lián)的構(gòu)造函數(shù)。
原型鏈
獲取對象屬性時(shí),如果對象本身沒有這個(gè)屬性,那就會(huì)去他的原型__proto__上去找,如果還查不到,就去找原型的原型,一直找到最頂層(Object.prototype)為止。Object.prototype對象也有__proto__屬性值為null。
1、原型鏈繼承
重點(diǎn):讓新實(shí)例的原型等于父類的實(shí)例。
特點(diǎn):1、實(shí)例可繼承的屬性有:實(shí)例的構(gòu)造函數(shù)的屬性,父類構(gòu)造函數(shù)屬性,父類原型的屬性。(新實(shí)例不會(huì)繼承父類實(shí)例的屬性?。?br/> 缺點(diǎn):1、新實(shí)例無法向父類構(gòu)造函數(shù)傳參。
2、繼承單一。
3、所有新實(shí)例都會(huì)共享父類實(shí)例的屬性。(原型上的屬性是共享的,一個(gè)實(shí)例修改了原型屬性,另一個(gè)實(shí)例的原型屬性也會(huì)被修改?。?br/>2、借用構(gòu)造函數(shù)繼承
重點(diǎn):用.call()和.apply()將父類構(gòu)造函數(shù)引入子類函數(shù)(在子類函數(shù)中做了父類函數(shù)的自執(zhí)行(復(fù)制))
特點(diǎn):1、只繼承了父類構(gòu)造函數(shù)的屬性,沒有繼承父類原型的屬性。
2、解決了原型鏈繼承缺點(diǎn)1、2、3。
3、可以繼承多個(gè)構(gòu)造函數(shù)屬性(call多個(gè))。
4、在子實(shí)例中可向父實(shí)例傳參。
缺點(diǎn):1、只能繼承父類構(gòu)造函數(shù)的屬性。
2、無法實(shí)現(xiàn)構(gòu)造函數(shù)的復(fù)用。(每次用每次都要重新調(diào)用)
3、每個(gè)新實(shí)例都有父類構(gòu)造函數(shù)的副本,臃腫。
3、組合繼承(組合原型鏈繼承和借用構(gòu)造函數(shù)繼承)(常用)
重點(diǎn):結(jié)合了兩種模式的優(yōu)點(diǎn),傳參和復(fù)用
特點(diǎn):1、可以繼承父類原型上的屬性,可以傳參,可復(fù)用。
2、每個(gè)新實(shí)例引入的構(gòu)造函數(shù)屬性是私有的。
缺點(diǎn):調(diào)用了兩次父類構(gòu)造函數(shù)(耗內(nèi)存),子類的構(gòu)造函數(shù)會(huì)代替原型上的那個(gè)父類構(gòu)造函數(shù)。
4、原型式繼承
重點(diǎn):用一個(gè)函數(shù)包裝一個(gè)對象,然后返回這個(gè)函數(shù)的調(diào)用,這個(gè)函數(shù)就變成了個(gè)可以隨意增添屬性的實(shí)例或?qū)ο蟆bject.create()就是這個(gè)原理。
特點(diǎn):類似于復(fù)制一個(gè)對象,用函數(shù)來包裝。
缺點(diǎn):1、所有實(shí)例都會(huì)繼承原型上的屬性。
2、無法實(shí)現(xiàn)復(fù)用。(新實(shí)例屬性都是后面添加的)
5、寄生式繼承
重點(diǎn):就是給原型式繼承外面套了個(gè)殼子。
優(yōu)點(diǎn):沒有創(chuàng)建自定義類型,因?yàn)橹皇翘琢藗€(gè)殼子返回對象(這個(gè)),這個(gè)函數(shù)順理成章就成了創(chuàng)建的新對象。
缺點(diǎn):沒用到原型,無法復(fù)用。
6、寄生組合式繼承(常用)
寄生:在函數(shù)內(nèi)返回對象然后調(diào)用
組合:1、函數(shù)的原型等于另一個(gè)實(shí)例。2、在函數(shù)中用apply或者call引入另一個(gè)構(gòu)造函數(shù),可傳參
重點(diǎn):修復(fù)了組合繼承的問題
繼承這些知識(shí)點(diǎn)與其說是對象的繼承,更像是函數(shù)的功能用法,如何用函數(shù)做到復(fù)用,組合,這些和使用繼承的思考是一樣的。上述幾個(gè)繼承的方法都可以手動(dòng)修復(fù)他們的缺點(diǎn),但就是多了這個(gè)手動(dòng)修復(fù)就變成了另一種繼承模式。
這些繼承模式的學(xué)習(xí)重點(diǎn)是學(xué)它們的思想,不然你會(huì)在coding書本上的例子的時(shí)候,會(huì)覺得明明可以直接繼承為什么還要搞這么麻煩。就像原型式繼承它用函數(shù)復(fù)制了內(nèi)部對象的一個(gè)副本,這樣不僅可以繼承內(nèi)部對象的屬性,還能把函數(shù)(對象,來源內(nèi)部對象的返回)隨意調(diào)用,給它們添加屬性,改個(gè)參數(shù)就可以改變原型對象,而這些新增的屬性也不會(huì)相互影響。
ES6中的 class繼承:
父類(基類)
子類
extends 關(guān)鍵字
//class 相當(dāng)于es5中構(gòu)造函數(shù)//class中定義方法時(shí),前后不能加function,全部定義在class的protopyte屬性中//class中定義的所有方法是不可枚舉的//class中只能定義方法,不能定義對象,變量等//class和方法內(nèi)默認(rèn)都是嚴(yán)格模式//es5中constructor為隱式屬性//父類 class People{ constructor(name='wang',age='27'){ this.name = name; this.age = age; } eat(){ console.log(`${this.name} ${this.age} eat food`) }}//子類 通過extends 繼承父類 class Woman extends People{ constructor(name = 'ren',age = '27'){ //繼承父類屬性 super(name, age); } eat(){ //繼承父類方法 super.eat() } } let wonmanObj=new Woman('xiaoxiami'); wonmanObj.eat();
一般來講,有以下的名詞約定:
promise(首字母小寫)對象指的是“Promise實(shí)例對象”
Promise首字母大寫且單數(shù)形式,表示“Promise構(gòu)造函數(shù)”
Promises首字母大寫且復(fù)數(shù)形式,用于指代“Promises規(guī)范”
什么是Promise?
Promise,簡單說就是一個(gè)容器,里面保存著某個(gè)未來才會(huì)結(jié)束的事件(通常是一個(gè)異步操作)的結(jié)果。
從語法上說,promise 是一個(gè)對象,從它可以獲取異步操作的的最終狀態(tài)(成功或失敗)。
Promise是一個(gè)構(gòu)造函數(shù),對外提供統(tǒng)一的 API,自己身上有all、reject、resolve等方法,原型上有then、catch等方法。
Promise的兩個(gè)特點(diǎn)
Promise對象的狀態(tài)不受外界影響
1)pending 初始狀態(tài)
2)fulfilled 成功狀態(tài)
3)rejected 失敗狀態(tài)
Promise 有以上三種狀態(tài),只有異步操作的結(jié)果可以決定當(dāng)前是哪一種狀態(tài),其他任何操作都無法改變這個(gè)狀態(tài)
Promise的狀態(tài)一旦改變,就不會(huì)再變,任何時(shí)候都可以得到這個(gè)結(jié)果,狀態(tài)不可以逆,只能由 pending變成fulfilled或者由pending變成rejected
Promise接受一個(gè)「函數(shù)」作為參數(shù),該函數(shù)的兩個(gè)參數(shù)分別是resolve和reject。這兩個(gè)函數(shù)就是就是「回調(diào)函數(shù)」
resolve函數(shù)的作用:在異步操作成功時(shí)調(diào)用,并將異步操作的結(jié)果,作為參數(shù)傳遞出去;
reject函數(shù)的作用:在異步操作失敗時(shí)調(diào)用,并將異步操作報(bào)出的錯(cuò)誤,作為參數(shù)傳遞出去。
const promise = new Promise((resolve, reject) => { // do something here ... if (success) { resolve(value); // fulfilled } else { reject(error); // rejected }});
resolve作用是,將Promise對象的狀態(tài)從“未完成”變?yōu)椤俺晒Α保磸?pending 變?yōu)?resolved),在異步操作成功時(shí)調(diào)用,并將異步操作的結(jié)果,作為參數(shù)傳遞出去;
reject作用是,將Promise對象的狀態(tài)從“未完成”變?yōu)椤笆 保磸?pending 變?yōu)?rejected),在異步操作失敗時(shí)調(diào)用,并將異步操作報(bào)出的錯(cuò)誤,作為參數(shù)傳遞出去。
promise有三個(gè)狀態(tài):
1、pending[待定]初始狀態(tài)
2、fulfilled[實(shí)現(xiàn)]操作成功
3、rejected[被否決]操作失敗
當(dāng)promise狀態(tài)發(fā)生改變,就會(huì)觸發(fā)then()里的響應(yīng)函數(shù)處理后續(xù)步驟;
promise狀態(tài)一經(jīng)改變,不會(huì)再變。
Promise對象的狀態(tài)改變,只有兩種可能:
從pending變?yōu)閒ulfilled
從pending變?yōu)閞ejected。
.then()
1、接收兩個(gè)函數(shù)作為參數(shù),分別代表fulfilled(成功)和rejected(失?。?br/>2、.then()返回一個(gè)新的Promise實(shí)例,所以它可以鏈?zhǔn)秸{(diào)用
3、當(dāng)前面的Promise狀態(tài)改變時(shí),.then()根據(jù)其最終狀態(tài),選擇特定的狀態(tài)響應(yīng)函數(shù)執(zhí)行
4、狀態(tài)響應(yīng)函數(shù)可以返回新的promise,或其他值,不返回值也可以我們可以認(rèn)為它返回了一個(gè)null;
5、如果返回新的promise,那么下一級(jí).then()會(huì)在新的promise狀態(tài)改變之后執(zhí)行
6、如果返回其他任何值,則會(huì)立即執(zhí)行下一級(jí).then()
.then()里面有.then()的情況
1、因?yàn)?then()返回的還是Promise實(shí)例
2、會(huì)等里面的then()執(zhí)行完,再執(zhí)行外面的
看完了這篇文章,相信你對js原型鏈,繼承和promis是什么有了一定的了解,想了解更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!