千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)

手機(jī)站
千鋒教育

千鋒學(xué)習(xí)站 | 隨時隨地免費(fèi)學(xué)

千鋒教育

掃一掃進(jìn)入千鋒手機(jī)站

領(lǐng)取全套視頻
千鋒教育

關(guān)注千鋒學(xué)習(xí)站小程序
隨時隨地免費(fèi)學(xué)習(xí)課程

當(dāng)前位置:首頁  >  應(yīng)聘面試  >  html5面試題  > hooks相對于class的優(yōu)化

hooks相對于class的優(yōu)化

來源:千鋒教育
發(fā)布人:
時間: 2022-11-16 16:58:45 1668589125

  類組件缺點(diǎn)一:復(fù)雜且不容易理解的“this” Hooks解決方式:函數(shù)組件和普通JS函數(shù)非常相似,在普通JS函數(shù)中定義的變量、方法都可以不使用“this.”,而直接使用該變量或函數(shù),因此你不再需要去關(guān)心“this”了。

  類組件缺點(diǎn)二:組件數(shù)據(jù)狀態(tài)邏輯不能重用 Hooks解決方式: 通過自定義Hook,可以數(shù)據(jù)狀態(tài)邏輯從組件中抽離出去,這樣同一個Hook可以被多個組件使用,解決組件數(shù)據(jù)狀態(tài)邏輯并不能重用的問題。 類組件缺點(diǎn)三:組件之間傳值過程復(fù)雜。

hooks相對于class的優(yōu)化

  缺點(diǎn)三:復(fù)雜場景下代碼難以組織在一起 Hooks解決方式: 通過React內(nèi)置的useState()函數(shù),可以將不同數(shù)據(jù)分別從"this.state"中獨(dú)立拆分出去。

  降低數(shù)據(jù)復(fù)雜度和可維護(hù)性,同時解決類組件缺點(diǎn)三中“內(nèi)部state數(shù)據(jù)只能是整體,無法被拆分更細(xì)”的問題。

  通過React內(nèi)置的useEffect()函數(shù),將componentDidMount、componentDidUpdate、componentWillUncount 3個生命周期函數(shù)通過Hook(鉤子)關(guān)聯(lián)成1個處理函數(shù),解決事件訂閱分散在多個生命周期函數(shù)的問題。

tags:
聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強(qiáng)師集結(jié),手把手帶你蛻變精英
請您保持通訊暢通,專屬學(xué)習(xí)老師24小時內(nèi)將與您1V1溝通
免費(fèi)領(lǐng)取
今日已有369人領(lǐng)取成功
劉同學(xué) 138****2860 剛剛成功領(lǐng)取
王同學(xué) 131****2015 剛剛成功領(lǐng)取
張同學(xué) 133****4652 剛剛成功領(lǐng)取
李同學(xué) 135****8607 剛剛成功領(lǐng)取
楊同學(xué) 132****5667 剛剛成功領(lǐng)取
岳同學(xué) 134****6652 剛剛成功領(lǐng)取
梁同學(xué) 157****2950 剛剛成功領(lǐng)取
劉同學(xué) 189****1015 剛剛成功領(lǐng)取
張同學(xué) 155****4678 剛剛成功領(lǐng)取
鄒同學(xué) 139****2907 剛剛成功領(lǐng)取
董同學(xué) 138****2867 剛剛成功領(lǐng)取
周同學(xué) 136****3602 剛剛成功領(lǐng)取
相關(guān)推薦HOT
快速通道