2018-09-21 React面試題

1、描述對react理解?

? ? ? react是一個用于構(gòu)建用戶界面的JS庫。

react主要用于構(gòu)建UI。很多人認為 React 是 MVC 中的 V(視圖)。

react起源于:Facebook的內(nèi)部項目,用來架設(shè)instagram網(wǎng)站,于2013年5月。

2、react特點?

生命式設(shè)計:react采用聲明范式。

高效:react通過對DOM的模擬,最大限度減少DOM交互。

靈活:react可與已知的庫和框架很好的配合。

JSX:JSX 是一個看起來很像 XML 的 JavaScript 語法擴展。

組件:通過react構(gòu)建組件,使得代碼更加容易得到復(fù)用,能夠很好應(yīng)用在大項目開發(fā)中。

單向頁面的數(shù)據(jù)流:react實現(xiàn)了單向響應(yīng)的數(shù)據(jù)流,從而減少了重復(fù)代碼,這也是它為什么比傳 ? ? ? ? ? ? ? ? ? ? ? ? ? 統(tǒng)數(shù)據(jù)綁定更簡單。

3、React中如何定義初始狀態(tài) ?

? ? ? State和Props

? ? ? State主要用于更新界面,組件的State屬性在生命周期函數(shù) getInitialState中初始化,當(dāng)調(diào)用組件的this.setState改變state的時候,組件會重新渲染刷新。

Props主要用于組件之間傳遞數(shù)據(jù),也就是標簽的屬性 這里的pname屬性就可以在MyText中通過this.props.pname得到

4、JSX的有什么優(yōu)點?

JSX 執(zhí)行更快,因為它在編譯為 JavaScript 代碼后進行了優(yōu)化。

它是類型安全的,在編譯過程中就能發(fā)現(xiàn)錯誤。

使用 JSX 編寫模板更加簡單快速。

5、如何創(chuàng)建虛擬DOM、組件?

Var? Com=React.createClass({render(){return ()}})

6、數(shù)組如何渲染到頁面?

ReactDOM.render(

組件,

Domcoment.getElementById()

)

7、構(gòu)建view視圖用哪個函數(shù)?

render: function () {}

8、什么是組件?

通過React.creatClass({})定義一個組件的

可以通過this.props對象傳遞數(shù)據(jù)

9、通過什么方法定義一個組件?

Let? Hello = react.createClass({

})

? ReactDOM.render(Hello,document.getElementById(“app”)

10、class是js中的保留字,所以用什么方法創(chuàng)建一個類名?

? class App extends Component{

}

export default App;

11、render函數(shù)中,如果多個元素嵌套時需要注意什么?

代碼中嵌套多個HTML標簽 ,需要使用一個標簽元素包裹她

12、寫事件是需要注意哪些問題?

? map函數(shù)渲染的子元素綁定

? ? ? ? ? 事件冒泡的問題

? ? ? ? ? 頁面?zhèn)鬟f參數(shù)問題

? ? ? ? ? 獲取頁面參數(shù)問題

13、什么是state?

是一個狀態(tài)機,根據(jù)數(shù)據(jù)的改變更新視圖

14、state怎么設(shè)置默認值?

getInitialState(){}

15、在哪個函數(shù)中修改狀態(tài)?

? setState((state)=>{})

16、props和state區(qū)別是什么?

? Props是一個屬性值,里面數(shù)據(jù)是不能改變的

? ? ? ? State是一個狀態(tài)機,根據(jù)數(shù)據(jù)的改變更改視圖

17、么獲取組件中定義的屬性?

this.state?

18、props驗證器?

propTypes{

? ? ? ? ? ? ? ? ? ? number:React.PropTypes.number.isRequired 判斷是數(shù)字類型

? ? ? ? ? ? ? ? ? ? arr:React.PropTypes.array.isRequired? ? 判斷是數(shù)組類型

? ? ? ? ? ? ? ? ? ? function:React.PropTypes.func.isRequired? 判斷是function類型

? ? ? ? ? ? ? ? ? ? bool:React.PropTypes.bool.isRequired? ? 判斷是布爾類型

? ? ? ? ? ? ? ? ? ? object:React.PropTypes.object.isRequired? 判斷是對象類型

19、簡述一下ref屬性?

? 是一個非常特殊的屬性,可以用來綁定到render()輸出的任何組件上,允許引用render()返回的相應(yīng)的支撐案例,用來確保任何時間總是拿到正確的實例;

20、Ref屬性有什么優(yōu)點?

? 可以用來綁定render輸出的任何組件

21、Ref怎么獲取支撐實例?

? ? 通過this.refs獲取屬性

22、組件的生命周期鉤子函數(shù)?

ComponentWillMount 編譯前。渲染前調(diào)用

componentDidMount 編譯完成,渲染后調(diào)用

componentWillUpdate 組件state調(diào)用后 將要更新時,但還沒有render調(diào)用

componentDidUpdate 在組件完成更新后立即被調(diào)用

componentWillUnmount 在組件從DOM中移除的時候被調(diào)用

componentWillReceiveProps 組件接受props之前

shouldComponentUpdate 組件state被調(diào)用? 必須返回一個布爾值,true false

23、組件中的七個方法??

SetState 設(shè)置狀態(tài)

ReplaceState 替換狀態(tài)

setProps設(shè)置屬性

replacerProps替換屬性

forceUpdate? 強制更新

findDOMNode獲取DOM節(jié)點

isMounted 判斷組件掛載狀態(tài)

24、構(gòu)建view視圖用哪個函數(shù)?

render(){

function(){

}

}

25、怎么創(chuàng)建一個組建?

var Com=React.createClass{

、render(){

return()

}

}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 作為一個合格的開發(fā)者,不要只滿足于編寫了可以運行的代碼。而要了解代碼背后的工作原理;不要只滿足于自己的程序...
    六個周閱讀 8,686評論 1 33
  • 原教程內(nèi)容詳見精益 React 學(xué)習(xí)指南,這只是我在學(xué)習(xí)過程中的一些閱讀筆記,個人覺得該教程講解深入淺出,比目前大...
    leonaxiong閱讀 2,954評論 1 18
  • React.js 小書學(xué)習(xí) 之 【使用 JSX 描述 UI 信息】 從 JSX 到頁面 過程圖解:JSX 到頁面過...
    zdlucky閱讀 1,451評論 0 20
  • GUIDS 第一章 為什么使用React? React 一個提供了用戶接口的JavaScript庫。 誕生于Fac...
    jplyue閱讀 3,717評論 1 11
  • 一. 首先進入命令窗口,進入你的數(shù)據(jù)庫. (win,mac 命令不一樣). 查看代碼是否是utf-8. 查看cha...
    SevenCoder閱讀 1,138評論 0 2

友情鏈接更多精彩內(nèi)容