| 課程級別 | 入門級 |
| 培訓(xùn)周期 | 一周以內(nèi) |
| 上課時間 | 全日制 |
| 上課地址 | 北京市豐臺夏家胡同育芳園東里三號樓B座 |
VUE3.0從實戰(zhàn)到源碼全剖析技術(shù)
?●
實戰(zhàn)培訓(xùn)班
●?
一、課程背景
Vue.js3.0橫空出世,代表前端未來趨勢,作為前端工程師必會技能和企業(yè)面試重點內(nèi)容,掌握Vue.js3.0的核心特性十分重要。通過學(xué)習(xí)本次公開課內(nèi)容,你不但可以知道VueJS2.0和VueJS3.0的區(qū)別,而且可以了解Vue3.0的核心特性,API用法,以方便將來更的工作，提升競爭力的同時也作為個人技術(shù)的加分項。
二、培訓(xùn)收益
本課程通過培訓(xùn)使學(xué)習(xí)者獲得如下收益：
1.Vue3.0源碼結(jié)構(gòu)全剖析，掌握TypeScript簡介和環(huán)境搭建；
2.了解VueJS2.0和VueJS3.0的區(qū)別，深入響應(yīng)式系統(tǒng)核心,手寫Vue3.0響應(yīng)式原理(實現(xiàn)reactive、ref、 computed、 effect)；
3.詳細(xì)剖析Vue3.0中DOM-DIFF算法原理；
4.手寫vite工具實現(xiàn)原理；
5.熟練掌握Vue3源碼進階。
三、培訓(xùn)對象
1.熱愛互聯(lián)網(wǎng)，追求互聯(lián)網(wǎng)體驗，想從事網(wǎng)頁開發(fā)、Web前端開發(fā)的學(xué)員；
2.原從事IT后臺開發(fā)，想完美轉(zhuǎn)型全棧開發(fā)的工程師；
3.沒有計算機基礎(chǔ)愿意從事IT開發(fā)，改變生活現(xiàn)狀，改變命運的學(xué)員；
4.開發(fā)人員轉(zhuǎn)型移動開發(fā)的學(xué)員。
四、培訓(xùn)特色
1.理論與實踐相結(jié)合、案例分析與行業(yè)應(yīng)用穿插進行；
2.精彩內(nèi)容解析、學(xué)員專題討論、分組研究；
3.通過知識理解、專題技能和實踐結(jié)合的授課方式。
時間 | 內(nèi)容 | 備注 |
第一天 上午 | TypeScript | 1. TypeScript簡介和環(huán)境搭建 2. TypeScript靜態(tài)類型 3. 基礎(chǔ)靜態(tài)類型和對象靜態(tài)類型 4. 類型注解和類型推斷 5. 函數(shù)參數(shù)和返回類型的注解 6. 數(shù)組類型注解的方法 7. 元組的使用和類型約束 8. 初識接口Interface 9. 初識接口Interface2 10. 類的概念和使用 11. 類的訪問類型 12. 類的構(gòu)造函數(shù) |
第一天 下午 | TypeScript | 1. 類的Getter、Setter和static 2. 抽象類和只讀屬性的使用 3. 配置文件-初識tsconfig.json文件 4. 配置文件-初識compilerOptions配置項 5. 配置文件-compilerOptions配置詳解 6. 聯(lián)合類型和類型保護（類型守護） 7. Enum枚舉類型詳細(xì)講解 8. TypeScript函數(shù)中使用泛型 9. TypeScrip在類中使用泛型 10. 初識TypeScript的命名空間-NameSpace 11. 深入TypeScript的命名空間-NameSpace 12. TypeScript如何使用impot語法 13. 用Parcel打包TypeScript代碼 14. 在TypeScript中使用Jquery庫 |
第二天 上午 | Vue3 | 1. 構(gòu)建vue項目 2. 2.0與3.0的差異 3. vue.config.js 4. Vue3.0開篇 5. diff算法 6. 靜態(tài)提升和監(jiān) 聽緩存 7. 項目創(chuàng)建 8. 存在的問題 9. 組合API上 10. 組合API中 11. 組合API下 12. 組合API本質(zhì) 13. setup執(zhí)行時機和注意點 14. Vue3.0-ref 15. ref和reactive區(qū)別 |
第二天 下午 | Vue3 | 1. 遞歸監(jiān) 聽 2. 非遞歸監(jiān) 聽 3. shallowRef本質(zhì) 4. toRaw 5. markRaw 6. toRef 7. toRefs 8. customRef上 9. customRef下 10. ref-獲取元素 11. readonly家族 12. V3響應(yīng)式數(shù)據(jù)本質(zhì)上 13. V3響應(yīng)式數(shù)據(jù)本質(zhì)下 14. 手寫shallowReactive-shallowRef 15. 手寫reactive-ref 16. 手寫readonly-shallowReadonly |
第三天 上午 | Vite | 17. Vite定義 18. Vite由來 19. 對比差異點 20. Optimize 21. HMR 22. Build 23. 打包 or 不打包 24. 開箱即用 25. 實現(xiàn)原理 |
第三天 下午 | Vue3源碼進階 | 1. 剖析Vue Composition API 2. 源碼目錄 3. Vue2響應(yīng)式原理機制-defineProperty 4. 對象攔截 5. 數(shù)組方法劫持 6. Vue3數(shù)據(jù)響應(yīng)機制-Proxy 7. reactive方法實現(xiàn) 8. effect實現(xiàn) 9. ref實現(xiàn) 10. computed實現(xiàn) |
溫馨提示
