本次總結(jié)了react和vue的一些高頻考點(diǎn)面試題

REACT

1.虛擬Dom和diff算法

diff算法：差異查找法，對(duì)于DOM結(jié)構(gòu)即為tree的差異查找算法，只有在React更新階段才會(huì)有Diff算法的運(yùn)用:react的diff運(yùn)算為了降低時(shí)間復(fù)雜度，是按層比較新舊兩個(gè)虛擬dom樹的。

2.A 組件嵌套 B 組件，那么他們的生命周期執(zhí)行順序是什么？

父組件創(chuàng)建階段的生命周期鉤子函數(shù)constructor

父組件創(chuàng)建階段的生命周期鉤了函數(shù) render

子組件創(chuàng)建階段的生命周期鉤子函數(shù)constructor

子組件創(chuàng)建階段的生命周期鉤子函數(shù) render

子組件創(chuàng)建階段的生命周期鉤子函數(shù) componentDidMount

父組件創(chuàng)建階段的生命周期鉤子函數(shù)componentDidMount

VUE的

3.什么是 Vue.nextTick()?

nextTick 是在下次DOM更新循環(huán)結(jié)束之后執(zhí)行延遲回調(diào)。在修改數(shù)據(jù)之后立即使用這個(gè)方法，獲取更新后的DOM，意思是等你dom加載完畢以后再去調(diào)用nextTick()里面的數(shù)據(jù)內(nèi)容

4.nextTick實(shí)現(xiàn)的原理是什么?是宏任務(wù)還是微任務(wù)?

微任務(wù)

原理:

nextTick方法主要是使用了宏任務(wù)和微任務(wù)，定義了一個(gè)異步方法，多次調(diào)用nextTick會(huì)將方法存入隊(duì)列中，通過這個(gè)異步方法清空隊(duì)列。

作用: nextTick用于下次Dom更新循環(huán)結(jié)束之后執(zhí)行延遲回調(diào)，在修改數(shù)據(jù)之后使用nextTick用于下次Dom更新循環(huán)結(jié)束之后執(zhí)行延遲回調(diào)，在修改數(shù)據(jù)之后使用nextTick用于下次Dom更新循環(huán)結(jié)束之后執(zhí)行延遲回調(diào)，在修改數(shù)據(jù)之后使用nextTick,則可以在回調(diào)中獲取更新后的DOM。

5.Vuex和redux有什么區(qū)別? 他們的共同思想

Redux和Vuex區(qū)別

·Vuex改進(jìn)了Redux中的Action和Reducer函數(shù)，以mutations變化函數(shù)取代Reducer，無需switch，只需在對(duì)應(yīng)的mutation函數(shù)里改變state值就可以

。Vuex由于Vue自動(dòng)重新渲染的特性，無需訂閱重新渲染函數(shù)，只要生成新的state就可以

。Vuex數(shù)據(jù)流的順序是:View調(diào)用store.commit提交對(duì)應(yīng)的請(qǐng)求到Store中對(duì)應(yīng)的mutation函數(shù) - store改變(vue檢測(cè)到數(shù)據(jù)變化自動(dòng)渲染)共同思想

。單一的數(shù)據(jù)源

。變化可以預(yù)測(cè)

。本質(zhì)上:Redux和Vuex都是對(duì)MVVM思想的服務(wù)，將數(shù)據(jù)從視圖中抽離的一種方案。形式上:Vuex借鑒了Redux，將store作為全局的數(shù)據(jù)中心，進(jìn)行數(shù)據(jù)管理