問題1：什么是虛擬dom？
主題: react
難度: ?
虛擬 dom (vdom)是真實 dom 在內(nèi)存中的表示。ui 的表示形式保存在內(nèi)存中，并與實際的 dom 同步。這是一個發(fā)生在渲染函數(shù)被調(diào)用和元素在屏幕上顯示之間的步驟，整個過程被稱為調(diào)和。
問題2：類組件和函數(shù)組件之間的區(qū)別是啥？
主題: react
難度:
類組件可以使用其他特性，如狀態(tài) state 和生命周期鉤子。當組件只是接收 props 渲染到頁面時，就是無狀態(tài)組件，就屬于函數(shù)組件，也被稱為啞組件或展示組件。
函數(shù)組件和類組件當然是有區(qū)別的，而且函數(shù)組件的性能比類組件的性能要高，因為類組件使用的時候要實例化，而函數(shù)組件直接執(zhí)行函數(shù)取返回結(jié)果即可。為了提高性能，盡量使用函數(shù)組件。
區(qū)別函數(shù)組件類組件是否有 this沒有有是否有生命周期沒有有是否有狀態(tài) state沒有有問題 3：react 中 refs 干嘛用的？
主題: react
難度:
refs 提供了一種訪問在render方法中創(chuàng)建的 dom 節(jié)點或者 react 元素的方法。在典型的數(shù)據(jù)流中，props 是父子組件交互的唯一方式，想要修改子組件，需要使用新的pros重新渲染它。凡事有例外，某些情況下咱們需要在典型數(shù)據(jù)流外，強制修改子代，這個時候可以使用 refs。
咱們可以在組件添加一個 ref 屬性來使用，該屬性的值是一個回調(diào)函數(shù)，接收作為其第一個參數(shù)的底層 dom 元素或組件的掛載實例。
class uncontrolledform extends component { handlesubmit = () => { console.log("input value: ", this.input.value) } render () { return ( <form onsubmit={this.handlesubmit}> <input type='text' ref={(input) => this.input = input} /> <button type='submit'>submit</button> </form> ) }}請注意，input 元素有一個ref屬性，它的值是一個函數(shù)。該函數(shù)接收輸入的實際 dom 元素，然后將其放在實例上，這樣就可以在 handlesubmit 函數(shù)內(nèi)部訪問它。
經(jīng)常被誤解的只有在類組件中才能使用 refs，但是refs也可以通過利用 js 中的閉包與函數(shù)組件一起使用。
function customform ({handlesubmit}) { let inputelement return ( <form onsubmit={() => handlesubmit(inputelement.value)}> <input type='text' ref={(input) => inputelement = input} /> <button type='submit'>submit</button> </form> )}問題 4：在 react 中如何處理事件
主題: react
難度:
為了解決跨瀏覽器的兼容性問題，syntheticevent 實例將被傳遞給你的事件處理函數(shù)，syntheticevent是 react 跨瀏覽器的瀏覽器原生事件包裝器，它還擁有和瀏覽器原生事件相同的接口，包括 stoppropagation() 和 preventdefault()。
比較有趣的是，react 實際上并不將事件附加到子節(jié)點本身。react 使用單個事件偵聽器偵聽頂層的所有事件。這對性能有好處，也意味著 react 在更新 dom 時不需要跟蹤事件監(jiān)聽器。
問題 5：state 和 props 區(qū)別是啥？
主題: react
難度:
props和state是普通的 js 對象。雖然它們都包含影響渲染輸出的信息，但是它們在組件方面的功能是不同的。即
state 是組件自己管理數(shù)據(jù)，控制自己的狀態(tài)，可變；props 是外部傳入的數(shù)據(jù)參數(shù)，不可變；沒有state的叫做無狀態(tài)組件，有state的叫做有狀態(tài)組件；多用 props，少用 state，也就是多寫無狀態(tài)組件。問題 6：如何創(chuàng)建 refs
主題: react
難度:
refs 是使用 react.createref() 創(chuàng)建的，并通過 ref 屬性附加到 react 元素。在構(gòu)造組件時，通常將 refs 分配給實例屬性，以便可以在整個組件中引用它們。
class mycomponent extends react.component { constructor(props) { super(props); this.myref = react.createref(); } render() { return <p ref={this.myref} />; }}或者這樣用：
class userform extends component { handlesubmit = () => { console.log("input value is: ", this.input.value) } render () { return ( <form onsubmit={this.handlesubmit}> <input type='text' ref={(input) => this.input = input} /> // access dom input in handle submit <button type='submit'>submit</button> </form> ) }}問題 7：什么是高階組件？
主題: react
難度:
高階組件(hoc)是接受一個組件并返回一個新組件的函數(shù)?；旧?，這是一個模式，是從 react 的組合特性中衍生出來的，稱其為純組件，因為它們可以接受任何動態(tài)提供的子組件，但不會修改或復(fù)制輸入組件中的任何行為。
const enhancedcomponent = higherordercomponent(wrappedcomponent);hoc 可以用于以下許多用例
代碼重用、邏輯和引導(dǎo)抽象渲染劫持state 抽象和操作props 處理問題 8：在構(gòu)造函數(shù)調(diào)用 super 并將 props 作為參數(shù)傳入的作用是啥？
主題: react
難度:
在調(diào)用 super() 方法之前，子類構(gòu)造函數(shù)無法使用this引用，es6 子類也是如此。將 props 參數(shù)傳遞給 super() 調(diào)用的主要原因是在子構(gòu)造函數(shù)中能夠通過this.props來獲取傳入的 props。
傳遞 props
class mycomponent extends react.component { constructor(props) { super(props); console.log(this.props); // { name: 'sudheer',age: 30 } }}沒傳遞 props
class mycomponent extends react.component { constructor(props) { super(); console.log(this.props); // undefined // 但是 props 參數(shù)仍然可用 console.log(props); // prints { name: 'sudheer',age: 30 } } render() { // 構(gòu)造函數(shù)外部不受影響 console.log(this.props) // { name: 'sudheer',age: 30 } }}上面示例揭示了一點。props 的行為只有在構(gòu)造函數(shù)中是不同的，在構(gòu)造函數(shù)之外也是一樣的。
問題 9：什么是控制組件？
主題: react
難度: ?
在 html 中，表單元素如 <input>、<textarea>和<select>通常維護自己的狀態(tài)，并根據(jù)用戶輸入進行更新。當用戶提交表單時，來自上述元素的值將隨表單一起發(fā)送。
而 react 的工作方式則不同。包含表單的組件將跟蹤其狀態(tài)中的輸入值，并在每次回調(diào)函數(shù)(例如onchange)觸發(fā)時重新渲染組件，因