React牵手JSX - 使用XML语法编写JAVASCRIPT

1. 什么是JSX

JSX (Javascript XML syntax transform) 是使用XML语法编写Javascript的一套解析工具;

X代表XML;也可以理解为扩展(eXtension),因为实现JSX功能本身就是使用Javascript;

React建议使用JSX(但非必要)


2. 为什么选择JSX

React和JSX是两个完全不相关的技术,但JSX是React的一个很重要的思想。


3. 对比Javascript和JSX语法

var Nav;
var app = <Nav color="blue" />; // JSX
var app = Nav({color:'blue'}); // Javascript

或许您不习惯JSX的语法,那么大可不必使用JSX;当然代码就会累赘一些,既然人家选择使用JSX,那么就有人家的道理,何不乐意的接受呢?

很明显我已经接受了,所以您可能看到的演示代码都使用了JSX语法。

使用JSX的三个理由:

  1. 方便DOM节点可视化 - 以往需要createElement \ append才能把一个DOM节点插入到文档中显示,使用JSX的代码就是 <a>React</a>,跟普通的HTML代码一样(规范的HTML文档本身就是XML文档);
  2. 方便创建变更DOM节点属性和内容;
  3. 方便MXML和XAML的开发人员 - 因为他们已经使用过类似的语法;

未完待续……

您可以修改并重新发布本文,如果您能留下本文的参考连结,万分谢谢!
如果您对本文存在疑问,欢迎留言或者直接对本文评论,我会在看到的第一时间回复您。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值