vue面試必背知識點(diǎn)？1.理解Vu前端編譯器babel的緩存機(jī)制是怎么做的？babel介紹babel是一個js編譯器。我們通常使用react、vue等框架編譯成瀏覽器可以執(zhí)行的代碼。個人感覺巴別塔是前

vue面試必背知識點(diǎn)？

1.理解Vu

前端編譯器babel的緩存機(jī)制是怎么做的？

babel介紹babel是一個js編譯器。我們通常使用react、vue等框架編譯成瀏覽器可以執(zhí)行的代碼。個人感覺巴別塔是前端建筑中最低最核心的部分。沒有它，前端肯定會回到刀耕火種的時代。

既然是編譯器，當(dāng)然會操作很多文件。在babel/core中，它讀取包括babelrc、pkgjson、插件、預(yù)置等在內(nèi)的大部分文件。，所以緩存操作文件的結(jié)果是必不可少的！

巴別塔 的緩存機(jī)制假設(shè)我們正在處理一個文件。對象和數(shù)組通常被用作js中的緩存容器。babel使用了es6提供的map，但它實際上是一個對象，只是它的鍵是任意的(不限于字符串)。

好了，現(xiàn)在我們有了一個緩存容器(map)，那么關(guān)鍵是什么呢？用來標(biāo)記一個文件，一般可以選擇使用文件的路徑和文件名的md5值，babel使用的是前者。

處理文件的過程可以定義一個handle方法，文件路徑是handle的一個參數(shù)。有時候只有一個文件路徑不能滿足業(yè)務(wù)邏輯，還需要傳入其他參數(shù)，所以handle還有第二個參數(shù)。

這里babel封裝了第二個參數(shù)，使之成為具有狀態(tài)管理能力的對象，所以handle的第二個參數(shù)就是這個對象。

句柄處理后，你會得到這次一個文件的處理結(jié)果值。是否要現(xiàn)在保存地圖中的值？對不起，它 不是的！

CacheConfigurator是一個具有狀態(tài)管理能力的對象，可以用在句柄處理的過程中。來修改狀態(tài)。得到value的值后，需要識別CacheConfigurator的狀態(tài)。

CacheConfigurator有三種狀態(tài):

紅色字體的有效項是check函數(shù)never，不需要緩存。

永遠(yuǎn)，你需要緩存，但是下次處理這個文件的時候，跳過驗證部分，直接返回值。

有效，下次處理這個文件時，需要通過驗證邏輯有效。

那么這個檢查邏輯是怎么來的呢？

那個 沒錯，它是在處理CacheConfigurator時由handle傳入的。

下次處理這個文件的時候，優(yōu)先考慮緩存的邏輯，只有通過驗證后，才直接返回值！

整體思路是這樣的，蒙大拿的思路還是很微妙的。這個思路在其他業(yè)務(wù)中也可以參考！

喜歡我的回答就關(guān)注我。有問題可以評論。讓 讓我們一起學(xué)習(xí)，一起成長！