1:React Native 相對于原生IOS、Android有哪些優(yōu)勢带斑?
答:
1:性能方面媲美原生App嘶朱。
2:絕大部分代碼同時(shí)適用IOS/Android,一套代碼兩系統(tǒng)適用丑搔。
3:使用Javascript編碼,上手容易提揍。
4:組件式開發(fā)啤月,易于管理維護(hù),代碼復(fù)用率高劳跃。
5:代碼更改后會自動(dòng)刷新谎仲,節(jié)省等待時(shí)間。
6:支持熱更新刨仑,更新無需重新安裝App郑诺。
2:React Native 組件的生命周期
答:和react組件的生命周期一致。
3:調(diào)用setState之后發(fā)生了什么杉武?
答:
1:將傳入的參數(shù)對象與當(dāng)前的狀態(tài)合并辙诞,然后觸發(fā)調(diào)和過程。
2:在調(diào)和過程中react會根據(jù)新的狀態(tài)以相對高效的方式構(gòu)建react元素樹轻抱。
3:react會對新舊元素樹進(jìn)行diff算法計(jì)算出差異飞涂,然后根據(jù)差異進(jìn)行最小化渲染。
4: reactJS中使用props.children.map()可能會報(bào)錯(cuò),為什么较店?應(yīng)該怎么處理士八?
答:
根據(jù)js map()函數(shù)的語法,只支持Array.map(), 所以props.children的值為非數(shù)組時(shí)就會報(bào)錯(cuò)梁呈!
解決辦法一:加值類型判斷婚度,符合Array時(shí)調(diào)用map()。
解決辦法二:使用系統(tǒng)提供的React.Children.map();
下邊我們看看props.children可能的值有哪些:
1:undefined 2: string 3: object 4: array;
解決辦法二:
5:簡述CodePush
答:
CodePush是微軟開發(fā)的一個(gè)云服務(wù)器捧杉,為開發(fā)者提供了熱更新應(yīng)用程序的服務(wù)陕见。
React Native 和 Cordova 的開發(fā)者可以通過CodePush直接部署移動(dòng)應(yīng)用更新給用戶設(shè)備秘血。
CodePush作為一個(gè)中央倉庫味抖,開發(fā)者可以推送更新(JS/HTML/CSS/IMAGES),應(yīng)用可以通過客戶端SDK查詢更新灰粮。
在修復(fù)一些小問題和添加新特性的時(shí)候仔涩,不需要二進(jìn)制打包,可以直接推送代碼進(jìn)行實(shí)時(shí)更新粘舟。
CodePush支持的功能:
直接對用戶部署代碼更新熔脂。
管理Alpha, Beta和生產(chǎn)環(huán)境應(yīng)用。
支持React Native 和 Cordova柑肴。
支持JS文件與圖片資源的更新
6:JS如何與原生相互調(diào)用霞揉?
答:
一:JS調(diào)用原生方法
第一種:和原生約定好,通過原生劫持JS發(fā)出的請求進(jìn)行原生調(diào)用晰骑。
第二種:webView添加要調(diào)用的原生方法接口适秩,直接調(diào)用。
第三種:利用第三方庫實(shí)現(xiàn)硕舆,如Andriod第三方庫 JSBridge秽荞。安全便捷。
二:原生調(diào)用JS
第一種:直接使用webView.evaluateJavacript()實(shí)現(xiàn)抚官。
第二種:利用三方庫扬跋,如JSBridge來實(shí)現(xiàn)。
第一種實(shí)現(xiàn)用例:
第二種實(shí)現(xiàn)方式用例:
7:說說你對Immutable的理解
答:
Javascript 中的對象一般是可變的(Mutable)凌节。 因?yàn)槭褂昧艘觅x值钦听,新的對象簡單的引用了原始對象,新舊對象的修改都將影響到彼此倍奢。雖然這樣做可以節(jié)省內(nèi)存朴上,但應(yīng)用變得復(fù)雜后,這就造成了非常大的隱患娱挨,Mutable帶來的優(yōu)點(diǎn)變得得不償失余指。為了解決這個(gè)問題,一般的做法是使用深淺拷貝來避免修改,但這樣又造成了CPU和內(nèi)存的浪費(fèi)酵镜。
而Immutable可以很好地解決這些問題碉碉。
目前流行的Immutable庫有兩個(gè):
1: immutable.js
2: seamless-immutable
Imutable優(yōu)點(diǎn):
1:降低了Mutable帶來的復(fù)雜度
2:節(jié)省內(nèi)存
3:Undo/Redo, Copy/Paste, 甚至?xí)r間旅行這些功能做起來都是小菜一碟。
4:并發(fā)安全
5:擁抱函數(shù)式編程
Immutable缺點(diǎn):
1:需要學(xué)習(xí)新的API
2:? 增加了資源文件的大小
3:容易和原生對象混淆
什么是Immutable Data?
Immutable Data是一旦被創(chuàng)建淮韭,就不能被更改的數(shù)據(jù)垢粮。對Immutable 對象的任何修改或添加刪除操作都會返回一個(gè)新的Immutable 對象似忧。Immutable 實(shí)現(xiàn)原理是持久化數(shù)據(jù)結(jié)構(gòu)(Persistent Data Structure),也就是使用舊數(shù)據(jù)創(chuàng)建新數(shù)據(jù)的同時(shí)要保證舊數(shù)據(jù)的可用且不變职车。同時(shí)又為了避免深拷貝把所有節(jié)點(diǎn)都復(fù)制一遍帶來的性能損耗,Immutable 使用了Structure Sharing(結(jié)構(gòu)共享)征绎,即如果對象樹中一個(gè)節(jié)點(diǎn)發(fā)生變化占键,只修改這個(gè)節(jié)點(diǎn)和受它影響的父節(jié)點(diǎn)昔善,其他節(jié)點(diǎn)則進(jìn)行共享∨弦遥看下圖動(dòng)畫
詳細(xì)參考:https://github.com/camsong/blog/issues/3
8:InteractionManager
答:
InteractionManager可以將一些耗時(shí)較長的工作安排到所有互動(dòng)或動(dòng)畫后執(zhí)行君仆,這樣可以保證JS動(dòng)畫的流暢性。如:Navigator轉(zhuǎn)場動(dòng)畫牲距。
延遲計(jì)劃函數(shù)比較:
requestAnimationFrame(): 用來執(zhí)行在一段時(shí)間內(nèi)控制視圖動(dòng)畫的代碼返咱。
setImmediate/setTimeout(): 在稍后執(zhí)行代碼。注意這有可能會延遲當(dāng)前正在進(jìn)行的動(dòng)畫牍鞠。
runAfterInteractions(): 在稍后執(zhí)行代碼咖摹,不會延遲當(dāng)前進(jìn)行的動(dòng)畫。
9:緩存用的是什么难述?
答:
AsyncStorage 它是一個(gè)簡單的萤晴、異步的、持久化的鍵值對存儲系統(tǒng)龄广,它對于App來說是全局的硫眯。可以用來替代LocalStorage择同。
官網(wǎng)推薦在此基礎(chǔ)上封裝一層两入,不要直接使用。
在IOS上敲才,AsyncStorage 在原生端的實(shí)現(xiàn)是把較小值存放在序列化的字典中裹纳,而把較大值寫入單獨(dú)的文件。
在Android上紧武,AsyncStorage會嘗試使用RocksDB,或退而選擇SQLite剃氧。
用例: