前端面試寶典之react篇

2021-09-02 02:09:34 字數 2003 閱讀 2640

keys 是 react 用於追蹤哪些列表中元素被修改、被新增或者被移除的輔助標識

該函式會在setstate函式呼叫完成並且元件開始重渲染的時候被呼叫,我們可以用該函式來監聽渲染是否完成:

this.setstate(

,  () => console.log('setstate has finished and the component has re-rendered.')

)

this.setstate((prevstate, props) => 

})

我們應當將ajax 請求放到componentdidmount函式中執行,主要原因有下

shouldcomponentupdate 允許我們手動地判斷是否要進行元件更新,根據元件的應用場景設定函式的合理返回值能夠幫我們避免不必要的更新

通常情況下我們會使用 webpack 的 defineplugin 方法來將 node_env 變數值設定為 production。編譯版本中 react 會忽略 proptype 驗證以及其他的告警資訊,同時還會降低**庫的大小,react 使用了 uglify 外掛程式來移除生產環境下不必要的注釋等資訊

為了解決跨瀏覽器相容性問題,react 會將瀏覽器原生事件(browser native event)封裝為合成事件(syntheticevent)傳入設定的事件處理器中。這裡的合成事件提供了與原生事件相同的介面,不過它們遮蔽了底層瀏覽器的細節差異,保證了行為的一致性。另外有意思的是,react 並沒有直接將事件附著到子元素上,而是以單一事件***的方式將所有的事件傳送到頂層進行處理。這樣 react 在更新 dom 的時候就不需要考慮如何去處理附著在 dom 上的事件***,最終達到優化效能的目的

createelement 函式是 jsx 編譯之後使用的建立 react element 的函式,而 cloneelement 則是用於複製某個元素並傳入新的 props

中介軟體提供第三方外掛程式的模式,自定義攔截 action -> reducer 的過程。變為 action -> middlewares -> reducer 。這種機制可以讓我們改變資料流,實現如非同步 action ,action 過濾,日誌輸出,異常報告等功能

蒼青浪 關於react面試題彙總 1、redux中介軟體

中介軟體提供第三方外掛程式的模式,自定義攔截 action -> reducer 的過程。變為 action -> middlewares -> reducer 。這種機制可以讓我們改變資料流,實現如非同步 action ,action 過濾,日誌輸出,異常報告等功能。

常見的中介軟體:

redux-logger:提供日誌輸出

redux-thunk:處理非同步操作

redux-promise:處理非同步操作,actioncreator的返回值是promise

2、redux有什麼缺點

1.乙個元件所需要的資料,必須由父元件傳過來,而不能像flux中直接從store取。

2.當乙個元件相關資料更新時,即使父元件不需要用到這個元件,父元件還是會重新render,可能會有效率影響,或者需要寫複雜的shouldcomponentupdate進行判斷。

3、react元件的劃分業務元件技術元件?

根據元件的職責通常把元件分為ui元件和容器元件。

ui 元件負責 ui 的呈現,容器元件負責管理資料和邏輯。

兩者通過react-redux 提供connect方法聯絡起來。

初始化階段

執行中狀態

銷毀階段

react效能優化是哪個週期函式

shouldcomponentupdate 這個方法用來判斷是否需要呼叫render方法重新描繪dom。因為dom的描繪非常消耗效能,如果我們能在shouldcomponentupdate方法中能夠寫出更優化的dom diff演算法,可以極大的提高效能

虛擬dom相當於在js和真實dom中間加了乙個快取,利用dom diff演算法避免了沒有必要的dom操作,從而提高效能

具體實現步驟如下

diff演算法?

前端面試寶典(二)

1 對web標準以及w3c的理解與認識 標籤閉合 標籤小寫 不亂巢狀 提高搜尋機械人搜尋機率。更少的 和元件,容易維護和改版,不需要變動頁面內容 列印版本而不需要複製內容,提高 的易用性。2 行內元素有哪些?塊級元素有哪些?css盒模型是什麼?塊級元素 div p h系列 form ul 行內元素 ...

ofo前端面試篇

今天參加了ofo的校招面試,自我感覺就是有一些東西是寫過但是沒存住,或者是說網上有現成的原始碼自己用的時候可能就是copy過來修改一下就直接用了。就答得感覺稀爛。不說了直接上題吧。一 頁面元素垂直居中 對於行內元素 若該行內元素只有一行,且該行內元素父元素的高度一定,可以設定該行內元素的line h...

前端面試寶典,一定要學會

之前一直沒寫就是因為辭職了,然後不斷的學習,不斷的整理,這兩天剛入職,我就趕快吧這點經驗分享出去,希望能幫助到換工作的兄弟們。1,簡歷 4,面試聊天 其實就是從側面了解你,他會問你什麼時候離職的啊?離職的原因是什麼啊?之前公司的薪水多少啊?公司的人員配置 後台前端測試什麼的 業餘時間都幹嘛呢?喜歡看...