當 ReactJS 遇到 TypeScript

 因爲本人應用項目主要是2B的web應用程序, 因此如下暫不談react的服務端渲染和react navie,

 

先說說ReactJS:

 

1. React 的組件化和  數據單向綁定 的模式（flux） 使應用程序更易於開發和維護。
2. 相對於angular,Ember這種全面的框架，react 比較輕量級（非包大小），這樣比較容易在其基礎上架構應用或者配合其餘功能庫。
3. 視圖層的JSX無縫混合js代碼，功能強大又不失可讀性，能夠說是集成了聲明式編程和命令式編程的優勢。
4. 框架支持增量更新DOM的特性能有效保證程序的性能，通俗點說，就是不容易讓通常水平的人寫出性能糟糕的程序，這一點對於組織大型複雜的應用程序來講是很重要的。

 

再說說TypeScript

   

1. 靜態類型的編程語言更有利於工程化的一個緣由是，更能被IDE充分的支持。宇宙最強IDE的VisualStudio 不僅給TypeScript帶來了很好的編程體驗，近視於C#的方式實現了代碼模塊化 同時又能保留js動態語言靈活性，
2. 一鍵生成解決了編譯壓縮的問題。
3. TSX對於React的JSX也提供了很好的支持。

 

使用ReactJS 和 TypeScrit 一段時間，總結了自認爲一些比較實用的Tip，跟各位分享，望能起到拋磚引玉的做用 ，高手不吝賜教 ：

1.如何打包成單個js

  使用r.js  與VS 編譯集成。固然在開發階段這部分能夠省略。

 

2. 組件化使用面向對象的方式，參考winform  和 webform

    面向對象的方式定義React組件（圖）

    組件基類：

    

    已經寫好的控件

    

3.使用消息機制來解耦

    組件之間的通訊，儘可能不要互相引用，經過消息機制來完成。

    Flux的思路也是如此，能夠不須要直接使用flux庫，若是掌握了flux的核心思路，用任何一個js事件消息庫均可以。

    這邊用的是EventEmitter2庫

   

 

    

4.本身定義路由機制

   

   

5.使用後端編程的插件機制來解耦

    因爲JS的動態語言特性，原生支持插件。因此只須要作一些少許封裝，就能夠實現簡單實用的IOC插件功能。

    

控件註冊：