每個(gè)框架的歷史
Angular是一個(gè)由Google支持的基于TypeScript的JavaScript框架。
React是一個(gè)用于構(gòu)建web應(yīng)用程序UI組件的JavaScript庫(kù)卦溢。由Facebook維護(hù)糊余。
Vue是前谷歌員工Evan You創(chuàng)建，它能夠使用HTML单寂，CSS和JavaScript構(gòu)建有吸引力的UI贬芥。被阿里巴巴，GitLab宣决，百度使用蘸劈。
單向數(shù)據(jù)流與雙向數(shù)據(jù)綁定
Angular使用雙向數(shù)據(jù)綁定，React用于單數(shù)據(jù)流尊沸，Vue支持兩者
Mircoapps和微服務(wù)的崛起
React和Vue可以靈活的選擇對(duì)應(yīng)用程序很重要的東西威沫。您只需將所需的庫(kù)添加到React和Vue中的源代碼中贤惯。Angular使用TypeScript，因而它更適合SPA而不是微服務(wù)壹甥。React和Vue都為開(kāi)發(fā)微應(yīng)用程序和微服務(wù)提供了更大的靈活性救巷。
Angular,React和Vue底層原理
Angular
實(shí)現(xiàn)雙向綁定原理：AngularJs為scope模型上設(shè)置了一個(gè)監(jiān)聽(tīng)隊(duì)列，用來(lái)監(jiān)聽(tīng)數(shù)據(jù)變化并更新view句柠。每次綁定一個(gè)東西到view(html)上時(shí)AngularJs就會(huì)往$watch隊(duì)列里插入一條$watch,用來(lái)檢測(cè)它監(jiān)視的model里是否有變化的東西浦译。當(dāng)瀏覽器接收到可以被angular context處理的事件時(shí)，$digest循環(huán)就會(huì)觸發(fā)溯职。$digest會(huì)遍歷所有的$watch精盅。從而更新DOM。這就是臟檢查機(jī)制谜酒。
$apply? angular context外發(fā)布model變化的消息叹俏，以前項(xiàng)目里將接口的請(qǐng)求封裝到promise對(duì)象里，then返回的數(shù)據(jù)需要手動(dòng)調(diào)用$scope.$apply()更新model的數(shù)據(jù)僻族。
$watch? 監(jiān)聽(tīng)model是否發(fā)生了變化 $scope.$watch(model變量粘驰，function(newvalue,oldvalue)=>{})
React
其基本原理就是：所有在JSX聲明的事件都會(huì)被委托在頂層document節(jié)點(diǎn)上，并根據(jù)事件名和組件名存回調(diào)函數(shù)(listenerBank)述么。每次當(dāng)某個(gè)組件觸發(fā)事件時(shí)蝌数，在document節(jié)點(diǎn)上綁定的監(jiān)聽(tīng)函數(shù)(dispatchEvent)就會(huì)找到這個(gè)組件和它的所有父組件(ancestors),對(duì)每個(gè)組件創(chuàng)建對(duì)應(yīng)React合成事件(SyntheticEvent)并批處理(runEventQueueInBatch(events))，從而根據(jù)事件名和組件名調(diào)用(invokeGuardedCallback)回調(diào)函數(shù)度秘。(實(shí)現(xiàn)了事件委托)顶伞。
Vue
實(shí)現(xiàn)雙向綁定的原理：采用數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方式，通過(guò)Object.defineProperty()來(lái)劫持各個(gè)屬性的setter剑梳，getter唆貌，設(shè)置一個(gè)監(jiān)聽(tīng)器Observer,用來(lái)監(jiān)聽(tīng)所有屬性，如果屬性上發(fā)生變化了垢乙，就需要告訴訂閱者Watcher去更新數(shù)據(jù)锨咙，最后指令解析器Compile解析對(duì)應(yīng)的指令，進(jìn)而會(huì)執(zhí)行對(duì)應(yīng)的更新函數(shù)追逮，從而更新視圖蓖租，實(shí)現(xiàn)了雙向綁定~
