課程背景
Vue 3 是 Vue.js 框架的第三代版本,它是一款用于構(gòu)建用戶界面的輕量級(jí)、漸進(jìn)式的 JavaScript 框架。Vue 3 在 2020 年 9 月正式發(fā)布,代號(hào)為 "One Piece"。這一版本在性能、易用性以及開發(fā)體驗(yàn)上都有了顯著的提升。
Vue 3 通過引入新的 Composition API 提高了代碼的可讀性和可維護(hù)性,使得邏輯更加清晰和易于復(fù)用。
此外,Vue 3 采用 Proxy 替換了原有的 Object.defineProperty 來實(shí)現(xiàn)響應(yīng)式系統(tǒng),這不僅簡(jiǎn)化了代碼,也提高了響應(yīng)式的效率。Vue 3 還優(yōu)化了其核心庫,使得打包大小更小,加載速度更快,并且增強(qiáng)了對(duì) TypeScript 的支持,幫助開發(fā)者更好地管理和維護(hù)代碼。借助 Vue 3 的新特性,開發(fā)者可以構(gòu)建出更快速、更健壯的 Web 應(yīng)用程序。無論是對(duì)于初學(xué)者還是經(jīng)驗(yàn)豐富的開發(fā)者,Vue 3 都是一個(gè)值得學(xué)習(xí)和使用的前端框架。
Vue.js3.0代表前端未來趨勢(shì),作為前端工程師必會(huì)技能和企業(yè)面試重點(diǎn)內(nèi)容,掌握Vue.js3.0的核心特性十分重要。通過學(xué)習(xí)本次課程內(nèi)容,學(xué)員不但可以了解VueJS2.0和VueJS3.0的區(qū)別,還可以掌握Vue3.0的核心特性,常用組件等底層框架邏輯,以方便將來更高效的工作,提升競(jìng)爭(zhēng)力的同時(shí)也作為個(gè)人技術(shù)的加分項(xiàng)。
課程簡(jiǎn)介
Vue 3.0帶來的不僅僅是性能上的提升和新特性的增加,更重要的是其內(nèi)部源碼的重新設(shè)計(jì)和實(shí)現(xiàn)。這使得許多開發(fā)者在享受Vue 3.0帶來的便利時(shí),也對(duì)其背后的實(shí)現(xiàn)原理產(chǎn)生了濃厚的興趣。為了更好地滿足開發(fā)者對(duì)Vue 3.0深入學(xué)習(xí)的需求,我們推出了《VUE3.0從實(shí)戰(zhàn)到源碼全剖析技術(shù)實(shí)戰(zhàn)》課程。通過本次學(xué)習(xí),你不但可以了解Vue 2.0和Vue 3.0的區(qū)別,而且可以掌握Vue 3.0的核心特性、API用法、以方便將來更高效的工作,在提升競(jìng)爭(zhēng)力的同時(shí)也作為個(gè)人技術(shù)的加分項(xiàng)。
參加培訓(xùn)并通過考試的學(xué)員,將獲得由工業(yè)和信息化部教育與考試中心統(tǒng)一頒發(fā)《VUE3.0技術(shù)(高級(jí))》工業(yè)和信息化職業(yè)能力證書,證書可作為專業(yè)技術(shù)人員職業(yè)能力考核的證明,以及專業(yè)技術(shù)人員崗位聘用、任職、定級(jí)和晉升職務(wù)的重要依據(jù)。
《前端Vue3框架實(shí)戰(zhàn)及源碼探究》證書樣本
培訓(xùn)收益
本課程通過培訓(xùn)使學(xué)習(xí)者獲得如下收益:
1.了解VueJS2.0和VueJS3.0的區(qū)別
2.Vue 3 的最新特性和最佳實(shí)踐。
3.掌握 Vue 3 的開發(fā)工具鏈和構(gòu)建流程。
4.理解 Vue 3 的 Composition API 和選項(xiàng)式 API 的區(qū)別
5.能夠獨(dú)立完成 Vue 3 應(yīng)用的開發(fā)和部署。
6.有能力閱讀和理解 Vue 3 的源碼
7.Vue3.0源碼結(jié)構(gòu)全剖析;
8.詳細(xì)剖析Vue3.0中DOM-DIFF算法原理;
9.熟悉 Vue 3 的響應(yīng)式系統(tǒng)和渲染流程,深入響應(yīng)式系統(tǒng)核心;
10.手寫Vue3.0響應(yīng)式原理(實(shí)現(xiàn)reactive、ref、 computed、 effect);
培訓(xùn)對(duì)象
熱愛互聯(lián)網(wǎng),追求極致互聯(lián)網(wǎng)體驗(yàn),想從事網(wǎng)頁開發(fā)、Web前端開發(fā)的學(xué)員;
原從事后IT臺(tái)開發(fā),想完美轉(zhuǎn)型全棧開發(fā)的工程師;
沒有計(jì)算機(jī)基礎(chǔ)愿意從事IT開發(fā),改變生活現(xiàn)狀,改變命運(yùn)的學(xué)員;
開發(fā)人員轉(zhuǎn)型移動(dòng)開發(fā)的學(xué)員。
要在面試或者競(jìng)爭(zhēng)中脫穎而出的開發(fā)者
技術(shù)團(tuán)隊(duì)負(fù)責(zé)人及架構(gòu)師
培訓(xùn)特色
理論與實(shí)踐相結(jié)合、案例分析與行業(yè)應(yīng)用穿插進(jìn)行;
專家精彩內(nèi)容解析、學(xué)員專題討論、分組研究;
通過全面知識(shí)理解、專題技能和實(shí)踐結(jié)合的授課方式。
中培優(yōu)勢(shì)
課程安排
時(shí)間 | 內(nèi)容 | 備注 |
第一天 | TypeScript | 1. TypeScript簡(jiǎn)介和環(huán)境搭建 2. TypeScript靜態(tài)類型 3. 基礎(chǔ)靜態(tài)類型和對(duì)象靜態(tài)類型 4. 類型注解和類型推斷 5. 函數(shù)參數(shù)和返回類型的注解 6. 數(shù)組類型注解的方法 7. 元組的使用和類型約束 8. 接口Interface 9. 類的概念和使用 10. 類的訪問類型 11. 類的構(gòu)造函數(shù) 12. 類的Getter、Setter和static 13. 抽象類和只讀屬性的使用 14. 配置文件-初識(shí)tsconfig.json文件 15. 配置文件-初識(shí)compilerOptions配置項(xiàng) 16. 配置文件-compilerOptions配置詳解 17. 聯(lián)合類型和類型保護(hù)(類型守護(hù)) 18. Enum枚舉類型詳細(xì)講解 19. TypeScript函數(shù)中使用泛型 20. TypeScrip在類中使用泛型 21. TypeScript的命名空間-NameSpace |
Vue3基礎(chǔ) | 1. Vue3新特性 2. setup和ref的基本使用 3. reactive的基本使用 4. 操作代理數(shù)據(jù)影響界面更新渲染 5. 響應(yīng)式數(shù)據(jù)的測(cè)試 6. Vue3-setup的執(zhí)行時(shí)機(jī)問題 7. Vue3-setup返回值的問題 8. Vue3-setup中的參數(shù) 9. Vue3-reactive和ref的細(xì)節(jié)問題 10. Vue3-計(jì)算屬性和監(jiān)視 22. Vue3-生命周期對(duì)比 |
|
第二天 | Vue3高級(jí) | 1. 遞歸監(jiān)聽 2. 非遞歸監(jiān)聽 3. shallowRef本質(zhì) 4. Vue3-toRaw和markRaw 5. toRef 6. toRefs 7. customRef上 8. customRef下 9. Vue3-provide和inject 10. ref-獲取元素 23. readonly家族 24. Fragment和Teleport組件介紹 25. Suspense組件介紹 |
Vue3源碼 | 1. Vue3源碼下載 2. Vue3源碼目錄結(jié)構(gòu) 3. vue3響應(yīng)式數(shù)據(jù)的原理 4. 響應(yīng)式數(shù)據(jù)的測(cè)試 5. Vue2響應(yīng)式原理機(jī)制-defineProperty 6. Vue3數(shù)據(jù)響應(yīng)機(jī)制-Proxy 7. Proxy實(shí)現(xiàn)響應(yīng)式邏輯 |
|
數(shù)據(jù)響應(yīng)式原理 | 1. Vue3源碼中的核心算法 2. 設(shè)計(jì)模式中的觀察者模式 3. 觀察者在響應(yīng)式中的應(yīng)用 4. 遞歸偵測(cè)對(duì)象全部屬性 5. 數(shù)組的響應(yīng)式處理 6. 收集依賴 7. Watcher類和Dep類 8. 手寫響應(yīng)式框架代碼 |
|
虛擬DOM和diff算法 | 1. 虛擬DOM和h函數(shù) 2. 感受diff算法 3. diff新舊節(jié)點(diǎn)處理 4. diff更新子節(jié)點(diǎn) 5. diff算法的子節(jié)點(diǎn)更新策略 |
|
第三天 | AST抽象語法樹 | 1. 指針?biāo)枷?br />
2. 遞歸深入例子 3. 棧的簡(jiǎn)介 4. 棧相關(guān)算法題 5. AST實(shí)現(xiàn)原理 6. 識(shí)別開始結(jié)束標(biāo)記 7. 使用棧形成AST 8. 識(shí)別Attrs |
模板引擎 | 1. 什么是模板引擎 2. 模版引擎的基本語法 3. 正則表達(dá)式思路簡(jiǎn)介 4. 底層tokens思想 5. 手寫實(shí)現(xiàn)mustache環(huán)境配置 6. 手寫實(shí)現(xiàn)Scanner類 7. 手寫將HTML變?yōu)閠okens 8. 手寫將tokens嵌套起來 9. 手寫將tokens注入數(shù)據(jù) 10. 手寫lookup函數(shù) 11. 手寫parseArray函數(shù) |
講師團(tuán)隊(duì)
張老師
北京航空航天大學(xué)軟件工程碩士
北京航空航天大學(xué)軟件工程碩士, 十幾年 IT 工作經(jīng)驗(yàn), 熟悉Html5、Html5游戲開發(fā),Cocos2d-html5,QuarkJS,JQuery,JQueryMobile,CSS,BootStrap,Mui框架,HBuilder,CSS3,Axure,JSON,C#,JavaScript,PHP,PhpCMS等開發(fā)技術(shù); 熟悉ICONIX,Scrum等項(xiàng)目管理過程并熟練應(yīng)用,熟悉UML建模,MVC,設(shè)計(jì)模式,架構(gòu)思想,熟悉軟件測(cè)試相關(guān)技能,熟悉軟件測(cè)試管理過程。多年項(xiàng)目管理經(jīng)驗(yàn),千人教育培訓(xùn)經(jīng)驗(yàn)。
郭老師
中培特聘專家
參與組織并完成了上百個(gè)個(gè)大中型項(xiàng)目。主要專業(yè)特長(zhǎng)包括HTML5、移動(dòng)前端、CSS3、AngularJS、React native、VueJS、BootStrap、Jquery、ZeptoJS、Ajax、JSON、JSONP、Mui框架等相關(guān)技術(shù),對(duì)Html5應(yīng)用開發(fā)及開發(fā)模式有深入研究,熟悉模塊化開發(fā),熟悉IT項(xiàng)目管理,熟悉ICONIX、Scrum等軟件研發(fā)過程改進(jìn)、詳細(xì)設(shè)計(jì)、IT規(guī)劃。擅長(zhǎng)UML建模、MVC、設(shè)計(jì)模式、架構(gòu)思想。
考試須知
前端Vue3框架實(shí)戰(zhàn)及源碼探究考試說明 | |||
考試形式 | 線上機(jī)考 | ||
考試平臺(tái) | 數(shù)字化人才培養(yǎng)--專項(xiàng)技術(shù)考試平臺(tái):www.qinzhounet.cn | ||
登錄方式 | 報(bào)名后即刻開通賬號(hào)密碼 | ||
考試時(shí)長(zhǎng) | 考試題型 | 題量 | 通過比例(分值) |
100分鐘 | 單選題 | 100道 | 60%、60分 |