react的優(yōu)點(diǎn):

1、React速度很快：它并不直接對(duì)DOM進(jìn)行操作，引入了一個(gè)叫做虛擬DOM的概念，安插在 javascript邏輯和實(shí)際的DOM之間，性能好。

2、跨瀏覽器兼容：虛擬DOM幫助我們解決了跨瀏覽器問(wèn)題，它為我們提供了標(biāo)準(zhǔn)化的API，甚至在IE8中都是沒(méi)問(wèn)題的。

3、一切都是component：代碼更加模塊化，重用代碼更容易，可維護(hù)性高。

4、單向數(shù)據(jù)流：Flux是一個(gè)用于在JavaScript應(yīng)用中創(chuàng)建單向數(shù)據(jù)層的架構(gòu)，它隨著React視圖庫(kù)的開(kāi)發(fā)而被Facebook概念化。

5、同構(gòu)、純粹的javascript：因?yàn)樗阉饕娴呐老x(chóng)程序依賴(lài)的是服務(wù)端響應(yīng)而不是JavaScript的執(zhí)行，預(yù)渲染你的應(yīng)用有助于搜索引擎優(yōu)化。

6、兼容性好：比如使用RequireJS來(lái)加載和打包，而B(niǎo)rowserify和Webpack適用于構(gòu)建大型應(yīng)用。它們使得那些艱難的任務(wù)不再讓人望而生畏。

小知識(shí)點(diǎn)

1、react兩種注釋?zhuān)?/p>

這個(gè)是在react里面的。

{/* 要注釋的內(nèi)容 */}

在代碼行里面用

/* */

2、html中的class在react中用className，html中的for在react中用htmlFor，行內(nèi)樣式書(shū)寫(xiě)規(guī)范style={{color:'red'}}

3、react中的表達(dá)式的用法：

　　在className中直接可以判斷什么狀態(tài)用什么樣式：className={2 > 1 ? 'class-a' : 'class-b'}

　　在模塊中直接根據(jù)條件來(lái)判斷具體用哪一個(gè)組件：{window.isLoggedIn ? <Nav /> : <Login />}

4 . React中的生命周期.

(1).Mount 掛載 (react Components被render解析生成對(duì)應(yīng)的dom節(jié)點(diǎn)被插入瀏覽器的dom結(jié)構(gòu)一個(gè)的過(guò)程

在瀏覽器看到組件元素從無(wú)到有的過(guò)程)

componentWillMount 在render()之前調(diào)用，因此在此方法中setState不會(huì)觸發(fā)重新渲染。

componentDIDMount（）

此方法在組件被mounted之后立即被調(diào)用，初始化dom節(jié)點(diǎn)應(yīng)該在此方法中，如需要從遠(yuǎn)端健在數(shù)據(jù)，這里是實(shí)例化網(wǎng)絡(luò)請(qǐng)求的好地方，此方法中setState會(huì)觸發(fā)組件重新渲染

(2).Update 更新(一個(gè)mounte的react Component被重新render的過(guò)程，但是在這個(gè)過(guò)程中，dom結(jié)構(gòu)并不一定會(huì)發(fā)生改變)

props和state的改變產(chǎn)生更新。在重新渲染組建時(shí)，如下的方法被調(diào)用

componentWillReceiveProps()React在組件mounting期間不會(huì)調(diào)用此方法，只有在一些組件的props可能被更新的時(shí)候才會(huì)調(diào)用

componentWillUpdate()

當(dāng)接收新的props或state,componentWillUpdate()在組件渲染之前被立即調(diào)用。使用此函數(shù)作為在更新發(fā)生之前執(zhí)行準(zhǔn)備的機(jī)會(huì)。初始渲染不會(huì)調(diào)用此方法。

componentDidUpdate()更新后立即被調(diào)用

(3).unmount 卸載(一個(gè)mount的react Component對(duì)應(yīng)的dom節(jié)點(diǎn)被從dom中移除的一個(gè)過(guò)程)

componentWillUnmount()

當(dāng)從dom中移除組件時(shí)，這個(gè)方法會(huì)被調(diào)用

5.prop和state

props是一個(gè)父組件傳遞給子組件的數(shù)據(jù)流，這個(gè)數(shù)據(jù)流可以一直傳遞到子孫組件。而state代表的是一個(gè)組件內(nèi)部自身的狀態(tài)

1.prop 用于定義外部接口，state用于記錄內(nèi)部狀態(tài)；

2.prop的賦值在外部世界使用組件時(shí)，state的賦值在組件內(nèi)部；

3.組件不應(yīng)該改變 prop 的值，而 state 存在的目的就是讓組件來(lái)改變的；

6.在受控表單組件中的value值都要與state屬性進(jìn)行綁定，并且需要通過(guò)onChange方法去改變值

eg: input textarea select

7.React組件間的通信：

1、父組件給子組件傳值，采用props的方式進(jìn)行調(diào)用和賦值，在父組件中設(shè)置相關(guān)屬性值或者方法，子組件通過(guò)props的方式進(jìn)行屬性賦值或者方法調(diào)用；

2、子組件給父組件傳值,子組件在子組件的構(gòu)造方法中調(diào)用父組件的方法,此時(shí)子組件的構(gòu)造函數(shù)的參數(shù)應(yīng)為子組件需傳給父組件的值,之后在父組件的方法中可以拿到子組件傳的值

8.React 中 keys 的作用

Keys 是 React 用于追蹤哪些列表中元素被修改、被添加或者被移除的輔助標(biāo)識(shí)。

9.Controlled Component(受控組件) 與 Uncontrolled Component (非受控組件)之間的區(qū)別是什么？

受控組件（Controlled Component）代指那些交由 React 控制并且所有的表單數(shù)據(jù)統(tǒng)一存放的組件；非受控組件（Uncontrolled Component）則是由DOM存放表單數(shù)據(jù)，并非存放在 React 組件中。

10.在生命周期中的哪一步發(fā)起 AJAX 請(qǐng)求

應(yīng)當(dāng)將AJAX 請(qǐng)求放到 componentDidMount 函數(shù)中執(zhí)行

11.React 中的事件處理邏輯

React 并沒(méi)有直接將事件附著到子元素上，而是以單一事件監(jiān)聽(tīng)器的方式將所有的事件發(fā)送到頂層進(jìn)行處理。這樣 React 在更新 DOM 的時(shí)候就不需要考慮如何去處理附著在 DOM 上的事件監(jiān)聽(tīng)器，最終達(dá)到優(yōu)化性能的目的。

12.傳入 setState 函數(shù)的第二個(gè)參數(shù)的作用

setState是異步的,該函數(shù)會(huì)在setState函數(shù)調(diào)用完成并且組件開(kāi)始重渲染的時(shí)候被調(diào)用，我們可以用該函數(shù)來(lái)監(jiān)聽(tīng)渲染是否完成。

13.路由庫(kù)React-Router

Router組件本身只是一個(gè)容器，真正的路由要通過(guò)Route組件定義.

Route組件還可以嵌套。

Link組件用于取代a元素，生成一個(gè)鏈接，允許用戶點(diǎn)擊后跳轉(zhuǎn)到另一個(gè)路由。它基本上就是a元素的React 版本，可以接收Router的狀態(tài)。

14.bind的作用.

答:

在react中如果不用箭頭函數(shù),就要用bind來(lái)綁定當(dāng)前組件

bind()最簡(jiǎn)單的用法是創(chuàng)建一個(gè)函數(shù)，使這個(gè)函數(shù)不論怎么調(diào)用都是bind()傳入的值;

15.this.props.children 表示組件的所有子節(jié)點(diǎn)

它的值有三種可能:

沒(méi)有子節(jié)點(diǎn) : 數(shù)據(jù)類(lèi)型 undefined

一個(gè)子節(jié)點(diǎn) : 數(shù)據(jù)類(lèi)型 object

多個(gè)子節(jié)點(diǎn) : 數(shù)據(jù)類(lèi)型 array

16.ref 可以獲取真實(shí)的Dom節(jié)點(diǎn) 由于ref獲取的是真實(shí)DOM,所以必須等到虛擬DOM插入文檔以后,才能使用
————————————————