React Native 面試常見問題

「React Native 使用分享 — 五年小回顧」投影片：https://revteltech.pse.is/react-native-5-years


React Native/React 顧問：https://consult.revtel.tech/

React Native 在近幾年因為可以有效統合前端技術路線受到蠻多公司的歡迎，在大前端時代之下像這類型的框架也能有效地提升個人的技術廣度。不過如果你想要去面試或者開始準備踏入這個領域，面試上該怎麼準備呢？

過往大概有直接/協助面試過超過二十位 RN 的開發者，有的來自大公司，有的是自學。這裡大概拋一下我通常會聊哪些問題。

下面列四個問題，會先配上一個簡單回答給大家參考。但簡單回答是為了往後延伸，不求完全精準，重點都是在面試者回答後再往下問的部分。

Q1: React Native、Native 及 hybrid APP 有什麼差異

簡單回答：「Native APP 是在個別平台用各自語言撰寫 APP，比如以 Swift 撰寫 iOS 程式、以 Kotlin 撰寫 android 程式。而 hybrid app 是以 webview 為基礎，開發者基本上更接近於寫網頁在開發 APP。而 React Native 和他們不同的點在於只是以 javascript 撰寫業務邏輯，框架本身會和原生組建介接以達到效能及開發資源的優勢。」。

這類問題比較是在考對 React Native 在技術譜系中位置的理解，建議也可以從效能、社區成熟度、開發工具以及熱加載上補充回答。另外也可以側面了解對方如果要再往下研究會朝哪個領域走。

Q2: 可以簡單介紹 React Native 生命週期嗎？

簡單回答：「可從三個角度理解 — 載入 / 更新 / 移除。載入時依序經過 constructor → getDerivedStateFromProps → shouldCOmponentUpdate → render → componentDidmount ; 更新時依序經過 getDerivedStateFromProps → shouldCOmponentUpdate → render → getSnapsjotBeforeUpdate → componentDidUpdate ; 移除時經過 componentWillUmount」

這題關鍵在想知道受試者是否具備 top-down 的思考觀點，反而急著背出相關函數的名稱不太重要，也可順勢延伸到效能調校的部分。

Q3: 常用哪些狀態管理工具？跟 Redux 熟嗎？

簡單回答：「過往比較習慣使用 Redux 作為全局資料管理工具。他就像個公佈欄，跟 props 有很好的整合及性質，協助描述 APP 資料狀態。近期則比較常使用 React 內建的 Context API，使用的概念大同小異。」

這個題目就有很多延伸的方向了

• Redux 原理概述，怎樣使用 reducer ?
• 該如何適度的做資料的管理（哪些該進全域？哪些該進 state）
• 怎麼規劃軟體內資料管理的方式？
• …

建議梳理一下自己對資料管理的原則，這邊沒有標準答案，但能看出實作及規劃兩個維度的熟悉度。

Q4: 有沒有使用過 codepush 等熱加載工具？他們的原理是什麼？

簡單回答：「codepush 是微軟提供的服務，呼叫 react native 的打包命令，將當前環境的非 native 程式碼全量打包成一個 bundle 檔案，後續可以進行發布。這個做法可以一定程度繞過 APP 審核，適合高速迭代的產品使用。」

這題比較是在考驗是否真的理解 React Native 運作原理（bundle）以及產品迭代的管理流程。建議試玩一下相關的功能，熱加載的概念在這類型技術上是很重要的標誌。

總結

以上四個方向不只是面試時可能會被問到也可以當成對自己學習技術時的確認座標。理解問題背後的原理往往才是變得更強的關鍵！

也歡迎有不同想法跟建議的朋友可以跟我們討論，切磋交流一起成長！

RevtelTech 忻旅科技 https://www.revtel.tech/

email：contact@revteltech.com

facebook：https://www.facebook.com/RevtelTech/