react的詳細知識講解!
react是一個用於構建使用者介面的JavaScript庫檔案,react可以使構建互動UI的過程變得簡單。對於你的應用裡面的每個狀態檢視,當資料變化的時候,react都會及時並且正確有效率地進行對其更新,這種陳述式檢視,將使你的程式碼更有可控性,並且更加易於除錯。web前端學習都會涉及react,今天小千就來給大家詳細的講述一下react的知識。
react有六大特點:宣告式設計——採用宣告正規化,可以輕鬆描述應用;高效——React透過對DOM的模擬,最大限度地減少與DOM的互動;靈活——React可以與已知的庫或框架很好地配合;JSX——JSX 是JavaScript語法的擴充套件;元件——透過React構建元件,使得程式碼更加容易得到複用;單向響應的資料流——React 實現了單向響應的資料流,從而減少了重複程式碼。
由於react是一個JavaScript庫,所以掌握它的前提就是:你已經有了相關JavaScript的基礎理解能力,你瞭解HTML和CSS。而這些也是一個專業的web應用安全培訓機構在設定課程時需要注意的一點。
接下來我們來了解react的生命週期、資料流及事件。
在元件的整個生命週期中,隨著該元件的props或者state發生改變,它的DOM表現也將有相應的變化,一個元件就是一個狀態機:對於特定的輸入,它總會返回一致的輸出。 React為每個元件提供了生命週期鉤子函式去響應不同的時刻,元件的生命週期分為三個部分:(1)例項化;(2)存在期;(3)銷燬&清理期。
在react中,資料流向是單向的——從父節點傳遞到子節點,因而元件是簡單且易於把握的,他們只需從父節點獲取props渲染即可。如果頂層元件的某個prop改變了,react會遞迴地向下遍歷整棵組建樹,重新渲染所有使用這個屬性的元件。react元件內部還具有自己的狀態,這些狀態只能在元件內修改。
react透過將時間處理器繫結到元件上來處理事件。在事件被觸發的同時,更新元件的內部狀態。元件內部狀態的更新會觸發元件重繪。因此,如果檢視層想要渲染出時間觸發後的結果,它所需要做的就是在渲染函式中讀取元件的內部狀態。
如果你想了解更多關於react的知識,你可以關注我,後期分享更多前端技術知識!
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31548651/viewspace-2773992/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 詳細講解:零知識證明 之 ZCash 完整的匿名交易流程
- 詳細講解:零知識證明 之 zk-SNARK 開篇
- 指標的詳細講解指標
- dart類詳細講解Dart
- Java中的static詳細講解Java
- Spring配置bean的詳細知識SpringBean
- 十七點安全知識詳細瞭解程式和病毒
- Go Struct超詳細講解GoStruct
- Java EL 詳細用法講解Java
- 最詳細的JVM&GC講解JVMGC
- Windows通用知識講解二Windows
- Javascript陣列的知識點講解JavaScript陣列
- ASM 知識詳解ASM
- 十七點學完安全知識超級詳細瞭解程式和病毒知識(轉)
- 詳細講解函式呼叫原理函式
- MyBatis-Plus詳細講解(一)MyBatis
- Spark開發-WordCount詳細講解Spark
- Struts配置檔案詳細講解
- DeFi和CeFi的區別詳細講解
- Android Fragment用法知識點的講解AndroidFragment
- 機器學習之決策樹詳細講解及程式碼講解機器學習
- 詳細講解23種設計模式設計模式
- Spark開發-WordCount流程詳細講解Spark
- HTML 超級連結詳細講解HTML
- oracle 9i statspack詳細講解Oracle
- 資料結構知識框架【超詳細】資料結構框架
- 用信鴿來講解HTTPS的知識HTTP
- vertical-align知識點講解
- 資料庫基礎知識講解資料庫
- 半導體分立器件基礎知識講解
- 演算法--揹包九講(詳細講解+程式碼)演算法
- 深入mysql基礎知識的詳解MySql
- Git基礎知識詳解Git
- Redis基礎知識詳解Redis
- Spring知識點詳解Spring
- Android 加密知識詳解Android加密
- Perl5 split 函式的使用詳細講解函式
- 核心交換機的TRUNK配置功能詳細講解(轉)