什么是React,React特點(diǎn),React的工作原理
React系列之--React簡(jiǎn)介React簡(jiǎn)介
一、什么是React
廢話不說(shuō),我們先看看官方是雜說(shuō)的
React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.
大概意思就是說(shuō)React是被Facebook和Instagram創(chuàng)建的一個(gè)針對(duì)Ui Js類(lèi)庫(kù),許多人也把它認(rèn)為是MVC中的V層。
話說(shuō),facebook對(duì)市面上所有的js類(lèi)庫(kù)都不滿(mǎn)意,所以自己就開(kāi)發(fā)了一個(gè),我只能說(shuō)真是牛'B'呀。有點(diǎn)扯遠(yuǎn)了。
我們只要知道這個(gè)玩意是用來(lái)創(chuàng)建V的就可以了
二、React特點(diǎn)
1、簡(jiǎn)單
用官方的話說(shuō)就是,使用react可以很簡(jiǎn)單的呈現(xiàn)出你的應(yīng)用。當(dāng)然學(xué)習(xí)也簡(jiǎn)單
2、聲明式
在數(shù)據(jù)發(fā)生變化的時(shí)候,React從概念上講與點(diǎn)擊了F5一樣,實(shí)際上它僅僅是更新了變化的一部分而已(通過(guò)虛擬DOM技術(shù)的diff算法)。
3、組件化
Rect的編寫(xiě)是基于組件的,它是把一個(gè)個(gè)組件組合起來(lái)形成一個(gè)界面,facebook使用組件化開(kāi)發(fā)代替模板引擎,通過(guò)js代碼生成View
下幅圖可以直觀的看到組件化的思想:
MVC:開(kāi)發(fā)者將三者定義成不同的類(lèi),實(shí)現(xiàn)了表現(xiàn)、數(shù)據(jù)、控制的分離(從技術(shù)角度拆分UI實(shí)現(xiàn)松耦合)
React:新的思路,開(kāi)發(fā)者從功能的角度出發(fā),將UI拆成不同的組件。每個(gè)組件都獨(dú)立封裝。即按照界面模塊自然劃分的方式來(lái)組織和編寫(xiě)你的代碼
4、一次學(xué)習(xí),到處使用
并沒(méi)有說(shuō)一次編寫(xiě)到處運(yùn)行,我們可以在客戶(hù)端渲染,也可以在服務(wù)端渲染,還可以在手機(jī)app上渲染(使用RN)
三、React的工作原理(基本原理)
1、Virtual DOM 虛擬DOM
和傳統(tǒng)的Web應(yīng)用的不同的是,React為了減少Dom的操作(Dom的更新代價(jià)是比較大的),不是全部更新Dom而是通過(guò)虛擬DOM的技術(shù),就是真實(shí)Dom的當(dāng)前Dom之間通過(guò)diff算法比較,只更新改變部分的Dom,這就大大提高了性能。
2、基于狀態(tài)更新(state和render)
React是如何渲染組件,并且在什么渲染組件的,這就要說(shuō)說(shuō)state和render了。state包含一些組件所需要的屬性,如果這些數(shù)據(jù)發(fā)生變化,那么就會(huì)自動(dòng)調(diào)用render方法來(lái)渲染組件,我們只能通過(guò)React的setState方法來(lái)更新組件狀態(tài)。
總結(jié):通過(guò)本節(jié)我們了解了以下幾點(diǎn):
1、React是一個(gè)V
2、React沒(méi)有模板的概念,是通過(guò)組件組合來(lái)使用
3、React通過(guò)虛擬Dom來(lái)更新組件
4、React是一個(gè)狀態(tài)機(jī)(通過(guò)狀態(tài)的改變來(lái)更新組件)
到此為止,我們對(duì)React就講完了。
上一篇: 什么是MVVM?
+相關(guān)資訊