浏览器解析jsx_React——JSX语法

JSX(JavaScript XML)是 js 内定义的一套类 XML 语法,可以解析出目标 js 代码,颠覆传统 js 写法。HTML 由浏览器解析,而 JSX 是由 js 解析。当让也可以通过构建工具先解析生成,如 grunt、 webpack ,这样可以减少代码这行中 js 解析 JSX 的时间,这个后面会专题讲诉。JSX 原本是使用官方自己提供的方法处理,但现在React JS 和 React Native 已经全部采用第三方Babel的JSX编译器实现。

JSX并不是由引擎或浏览器来实现,也并不打算并入到ECMAScript标准规范中,它旨在被各种预处理器转换成标准的ECMAScript语法。正如前面所说,JSX就像XML一样,它定义有自己的标签名、属性、子元素,需要注意的是,如果属性的值在大括号内,会当作JavaScript表达式处理,如果在引号内,则会当作字符串类型(String)处理。

它具有以下优点:

1 更加熟悉,语法跟HTML非常相似(90以上相似度)

2 更加语义化,允许自定义标签及组件。

3 更加直观,标签处理方式,更加可读。

4 抽象化,React的升级,不需要改动任何JSX代码。

5 关注点分离,模块化,JSX以干净且简洁的方式保证了组件中的标签与所有业务逻辑的互相分离。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值