react 經(jīng)典面試

1.生命周期函數(shù)


一.初始階段

componentWillMount 實(shí)例掛載前

render 渲染組建

componentDidMount實(shí)例掛載完成


二.運(yùn)行階段

componentWillReceiveProps 父組建改變時(shí)調(diào)用

sholudComponentUpdate:主要是用來手動(dòng)阻止組件渲染,一般在這個(gè)函數(shù)中做組件的性能優(yōu)化。

componentWillUpdate:組件數(shù)據(jù)更新前調(diào)用

componentDidUpdate:組件數(shù)據(jù)更新完成時(shí)調(diào)用

三.銷毀階段

componentWillUnmount:銷毀階段。一般用來銷毀不用的變量或者是解除無用定時(shí)器以及解綁無用事件。防止內(nèi)存泄漏問題。


react中key的作用

key是React中用于追蹤哪些列表中元素被修改、刪除或者被添加的輔助標(biāo)識(shí)。在diff算法中,key用來判斷該元素節(jié)點(diǎn)是被移動(dòng)過來的還是新創(chuàng)建的元素,減少不必要的元素重復(fù)渲染。


setState第二個(gè)參數(shù)的作用

因?yàn)閟etState是一個(gè)異步的過程,所以說執(zhí)行完setState之后不能立刻更改state里面的值。如果需要對(duì)state數(shù)據(jù)更改監(jiān)聽,setState提供第二個(gè)參數(shù),就是用來監(jiān)聽state里面數(shù)據(jù)的更改,當(dāng)數(shù)據(jù)更改完成,調(diào)用回調(diào)函數(shù)。


sass和less的區(qū)別

定義變量的符號(hào)不同,less是用@,sass使用$

變量的作用域不同,less在全局定義,就作用在全局,在代碼塊中定義,就作用于整哥代碼塊。而sass只作用域全局。

編譯環(huán)境不同,less在開發(fā)者環(huán)境編譯,sass在服務(wù)器環(huán)境下編譯。

react生命周期中,最適合與服務(wù)端進(jìn)行數(shù)據(jù)交互的是哪個(gè)函數(shù)

componentDidMount:在這個(gè)階段,實(shí)例和dom已經(jīng)掛載完成,可以進(jìn)行相關(guān)的dom操作。

父?jìng)髯樱ńM件嵌套淺):父組件定義一個(gè)屬性,子組件通過this.props接收。

子傳父:父組件定義一個(gè)屬性,并將一個(gè)回調(diào)函數(shù)賦值給定義的屬性,然后子組件進(jìn)行調(diào)用傳過來的函數(shù),并將參數(shù)傳進(jìn)去,在父組件的回調(diào)函數(shù)中即可獲得子組件傳過來的值。


react性能優(yōu)化的方案

(1)重寫shouldComponentUpdate來避免不必要的dom操作。

(2)使用 production 版本的react.js。

(3)使用key來幫助React識(shí)別列表中所有子組件的最小變化。


webpack

webpack是一個(gè)前端模塊化打包工具,主要由入口,出口,loader,plugins四個(gè)部分。前端的打包工具還有一個(gè)gulp,不過gulp側(cè)重于前端開發(fā)的過程,而webpack側(cè)重于模塊,例如他會(huì)將css文件看作一個(gè)模塊,通過css-loader將css打包成符合css的靜態(tài)資源。


Es6中箭頭函數(shù)與普通函數(shù)的區(qū)別?

1.普通function的聲明在變量提升中是最高的,箭頭函數(shù)沒有函數(shù)提升

2.箭頭函數(shù)沒有this,arguments

3.箭頭函數(shù)不能作為構(gòu)造函數(shù),不能被new,沒有property,

4.call和apply方法只有參數(shù),沒有作用域


什么是閉包?閉包有什么危害?如何解決閉包帶來的危害?

簡(jiǎn)單來說,閉包就是一個(gè)定義在函數(shù)內(nèi)部的函數(shù)。因?yàn)閖s中存在作用域的問題,所以在函數(shù)內(nèi)部定義的變量在函數(shù)外部是沒有辦法直接獲取到。而閉包就是溝通函數(shù)內(nèi)部和外部的橋梁,這樣在函數(shù)外部接可以得到函數(shù)內(nèi)部的值。并且閉包可以實(shí)現(xiàn)函數(shù)屬性和方法的私有化。

閉包的危害:

因?yàn)殚]包會(huì)將內(nèi)部變量?jī)?chǔ)存在內(nèi)存中,如果長(zhǎng)時(shí)間不清除的話會(huì)造成內(nèi)存泄漏的問題,影響程序的性能。

解決方法:對(duì)于不使用的變量及時(shí)的清除。

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

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

  • 1、react生命周期及相關(guān)用法 react的生命周期分為初始化階段、運(yùn)行階段、銷毀階段。(1)初始化階段 (2)...
    LY的編程生活閱讀 1,675評(píng)論 1 0
  • 前端開發(fā)面試題 面試題目: 根據(jù)你的等級(jí)和職位的變化,入門級(jí)到專家級(jí),廣度和深度都會(huì)有所增加。 題目類型: 理論知...
    怡寶丶閱讀 2,678評(píng)論 0 7
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)。 注意:講述HT...
    kismetajun閱讀 28,802評(píng)論 1 45
  • 作為一個(gè)合格的開發(fā)者,不要只滿足于編寫了可以運(yùn)行的代碼。而要了解代碼背后的工作原理;不要只滿足于自己的程序...
    六個(gè)周閱讀 8,674評(píng)論 1 33
  • $HTML, HTTP,web綜合問題 1、前端需要注意哪些SEO 2、 的title和alt有什么區(qū)別 3、HT...
    Hebborn_hb閱讀 4,771評(píng)論 0 20

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