優點:
1.允許使用熟悉的語法來定義 HTML 元素樹;
2.提供更加語義化且移動的標簽;
3.程序結構更容易被直觀化;
4.抽象了 React Element 的創建過程;
5.可以隨時掌控 HTML 標簽以及生成這些標簽的代碼;
6.是原生的 JavaScript。
對於各種優點下面詳細介紹一下:
1.更加熟悉:許多團隊都包括了非開發人員,例如熟悉 HTML 的 UI 以及 ux 設計師和負責完整測試產品的質量保證人員。使用 JSX 之后,這些團隊成員都可以更輕松的閱讀和貢獻代碼。任何熟悉基於 XML語言的人都可以輕松的掌握 JSX。此外,由於 React 組件囊括了所有可能的 DOM 表現形式(后續詳細解釋),因此 JSX 能巧妙地用簡單明了的方式來展現這種結構。
2.更加語義化:提供更加語義化且易懂的標簽(將傳統的HTML標簽封裝成React組件),我們就可以像使用HTML標簽一樣使用這個組件。
3.更加直觀:JSX 讓小組件更加簡單、明了、直觀。在有上百個組件及更深層標簽樹的大項目中,這種好處會成倍地放大。在函數作用域內,使用 jsx 語法的版本與使用原生 JavaScript 相比,其標簽的意圖變得更加直觀,可讀性也更高。
4.抽象化:對於使用 jsx 的人來說,從 React0.11升級到 React0.12是無痛的——不需要修改任何代碼。雖然不是靈丹妙葯,但是 jsx 提供的抽象能力確實能夠減少代碼在項目開發過程中的改動。
5.關注點分離:將HTML 標簽以及生成這些標簽的代碼內在地緊密聯系在一起。在 React 內,你不需要把整個程序甚至單個組件的關注點分離成視圖和模板文件。相反,React 鼓勵你為每一個關注點創造一個獨立的組件,並把所有的邏輯和標簽封裝在其中。
JSX 以干凈切簡潔的方式保證了組件中的標簽與所有業務邏輯的相互分離。它不僅提供了一個清晰、直觀的方式來描述組件樹,同時還讓你的應用程序更加符合邏輯。
