下載本文檔
版權說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權,請進行舉報或認領
文檔簡介
1、零基礎學透 TypeScript / 4-4 混入,兼顧值和類型的合并操作 混入,兼顧值和類型的合并操作更新時間:2019-07-15 09:58:47 耐心是一切聰明才智的基礎。 柏拉圖 混入即把兩個對象或者類的內(nèi)容,混合起來,從而實現(xiàn)一些功能的復用。如果你使用過 Vue,你應該知道 Vue 的mixins 這個 api,它可以允許你將一些 到對象的屬性、方法混入到一些組件。接下來我們先來看看個在JavaScript 中實現(xiàn)的簡單混入: class A constructor() funcA() console.log(here);class B constructor() funcB()
2、const mixin = (target, from) = / 這里定義一個函數(shù)來將一個類混入到目標類 Object.getOwnPropertyNames(from).forEach(key = / 通過Object.getOwnPropertyNames可以獲取一個對象自身定義的而非繼承來的屬性名組成的數(shù)組 targetkey = fromkey; / 將源類原型對象上的屬性拿來添加到目標類的原型對象上 );mixin(B.prototype, A.prototype); / 傳入兩個類的原型對象 const b = new B(); b.funcA(); / here我們通過Objec
3、t.getOwnPropertyNames 方法獲取一個對象自身的屬性,這里自身指除去繼承的屬性,獲取到屬性后將屬性賦值給目標對象。 這是 JavaScript 中的簡單混入,在 TypeScript 中我們知道,除了值還有類型的概念,所以簡單地將屬性賦值到目標元素是不行的,還要處理類型定義,我們來看下 TypeScript 中混入的例子: class ClassAa isA: boolean; funcA() class ClassBb isB: boolean; funcB() / 定義一個類類型接口AB,我們在講類的時候補充過類和接口之間的繼承,也講過類類型接口 / 這里是讓類AB繼承C
4、lassAa和ClassBb的類型,所以使用implements關鍵字,而不是用extends class AB implements ClassAa, ClassBb constructor() isA: boolean = false; / 定義兩個實例屬性 isB: boolean = false;funcA: () = void; / 定義兩個方法,并指定類型 funcB: () = void;function mixins(base: any, from: any) / 這里我們改造一下,直接傳入類,而非其原型對象,base是我們最后要匯總而成的類,from是個數(shù)組,是我們要混入的源
5、類組成的數(shù)組 from.forEach(fromItem = Object.getOwnPropertyNames(fromItotype).forEach(key = totypekey = fromItotypekey;););mixins(AB, ClassAa, ClassBb); const ab = new AB(); console.log(ab);/*isA: false, isB: false, proto : funcA: f ()funcB: f () constructor: f來看下這個例子。這個例子中我們定義了兩個類 A
6、和 B,它們分別有自己的方法和實力屬性。如果我們想使用它們的所有屬性和方法來創(chuàng)建實例,就需要將它們做一個混合。因為包含類型定義,所以我們首先要定義一個接口,來 包含著兩個類中元素類型的定義。所以我們定義一個類類型接口,然后讓這個類類型接口 AB 通過 implements 繼承 A 和 B 這兩個類,這樣類 AB 就會同時擁有類 A 和 B 的類型定義,還有自身定義的一些類型和值。所以此時類AB 相當于: class AB isA: boolean = false; isB: boolean = false; funcA: () = void; funcB: () = void;然后我們通過 mixins 函數(shù)將類 A 和類 B 的原型對象的屬性方法賦值給類 AB,因為類 AB 有 funcA 和 funcB 的類型定義,所以可以把 funcA 和 funcB 函數(shù)實體賦值給類 AB。 本節(jié)小結(jié)本小節(jié)我們學習了在TypeScript中如何實現(xiàn)混入,來復用現(xiàn)有邏輯。我們還同時復習了類類型接口和接口繼承類的知識,可以去2.10小節(jié)復習一下,大家可以多看下本小節(jié)的例子,來深入理解類和接口的混合使用。 下個小節(jié)我們將學習Promise以及它的語法糖async/await語法,通過它們我們可以實現(xiàn)同步操作,過去我們需要保證代碼執(zhí)行順序的邏輯,一般
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
- 4. 未經(jīng)權益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 保定學院《環(huán)境影響評價》2023-2024學年第一學期期末試卷
- 2023-2024學年廣東省廣州市海珠區(qū)八年級下學期物理期末試題
- “一核兩課”研究性學習模式的設計與實施
- 帶導電指尖的手套項目可行性實施報告
- 寶雞文理學院《理論力學》2021-2022學年第一學期期末試卷
- 曬黑油化妝品項目可行性實施報告
- 戒煙用藥物制劑相關項目實施方案
- 無線電尋呼機市場環(huán)境與對策分析
- 寶雞文理學院《機械制造裝備設計》2022-2023學年第一學期期末試卷
- 日期滾輪印章項目可行性實施報告
- 道法友誼的真諦課件-2024-2025學年統(tǒng)編版道德與法治七年級上冊
- 2024秋期國家開放大學??啤睹袷略V訟法學》一平臺在線形考(任務1至5)試題及答案
- 第5課《老師您好!》道德與法治2024-2025一年級上冊教案教學設計
- 2024年“學憲法、講憲法”題庫
- 2024-2030年中國人參皂甙RB2市場供需潛力規(guī)模與投資前景策略研究研究報告
- 小竅門大搜索(教學設計)-2024-2025 學年六年級上冊綜合實踐活動教科版
- 《保險科技》課件-第四章 區(qū)塊鏈及其在保險中的應用
- 第一單元(單元測試)-2024-2025學年三年級上冊道德與法治 統(tǒng)編版
- 2024年成人高考高起點英語真題及答案1
- 2025年高考語文備考之10年真題專題分類匯編:小說
- 三、你好奧運會(教學設計)魯科版二年級上冊綜合實踐活動
評論
0/150
提交評論