React和Jquery比較


Jquery的工作方式:

 

假如你需要給一個按扭添加一個點擊事件。

首先根據CSS規則找到對應的dom元素,掛上一個匿名事件處理函數,在事件處理函數中,選中那個需要被修改的DOM元素,讀取他的文本值,加以修改,然后修改這個dom元素。

優點:直觀易懂。缺點:對於龐大的項目,會造成代碼結構復雜,難以維護。

React的工作理念:

 

  打一個比方, React是一個聰明的建築工人,而 jQuery是一個比較傻的建築工人, 開發者你就是一個建築的設計師,如果是 jQuery 這個建築工人為你工作,你不得不事無 巨細地告訴 jQuery“如何去做”,要告訴他這面牆要拆掉重建,那面牆上要新開一個窗戶, 反之,如果是 React這個建築工人為你工作,你所要做的就是告訴這個工人“我想要什 么樣子”,只要把圖紙遞給 React這個工人,他就會替你搞定一切,當然他不會把整個建 築拆掉重建,而是很聰明地把這次的圖紙和上次的圖紙做一個對比,發現不同之處,然 后只去做適當的修改就完成任務了 。

  React 的工作方式把開發者從繁瑣的操作中解放出來,開發者只需要着重 “我想要顯示什么”,而不用操心“怎樣去做” 。利用聲明式的語法,讓開發者專注於描述用戶界面“顯示成什么樣式”,而不是重復思考“如何去顯示”。

缺點:對於一個簡單的例子也要編寫很多代碼。

優點:避免構建復雜的程序結構,利用函數式編程的思維來解決用戶界面渲染的問題,使開發效率大大提高。

   對於大型項目更易管理,整個 React 應用要做的就是渲染,開發者關注的是渲染成成什么樣子,而不用關心如何實現增量 渲染。

React 的理念 ,歸結為一個公式: UI=render(data)

讓我們來看看這個公式表達的含義,用戶看到的界面( UI),應該是一個函數(在這 里叫 render)的執行結果,只接受數據( data)作為參數。 這個函數是一個純函數,所謂 純函數,指的是沒有任何副作用,輸出完全依賴於輸入的函數,兩次函數調用如果輸人 相同,得到的結果也絕對相同 。 如此一來,最終的用戶界面,在 render 函數確定的情況 下完全取決於輸入數據 。

對於開發者來說,重要的是區分開哪些屬於 data,哪些屬於 render,想要更新用戶 界面,要做的就是更新 data,用戶界面自然會做出響應,所以 React實踐的也是“響應 式編程”( Reactive Programming)的思想,這也就是 React 為什么叫做 React 的原因 。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM