本文目录一览:
- 1、jsx,就是一个js语法的扩展吗?
- 2、jsx文件如何是什么
- 3、如何使用react-tools将jsx编译成JavaScript
- 4、js 和 jsx 有什么区别
- 5、jsx是javascript的一种语法扩展吗
jsx,就是一个js语法的扩展吗?
JSX是一种JavaScript的语法扩展,运用于React架构中,其格式比较像是模版语言,但事实上完全是在JavaScript内部实现的。元素是构成React应用的最小单位,JSX就是用来声明React当中的元素,React使用JSX来描述用户界面
jsx文件如何是什么
JSX 文件,即带有扩展的 JavaScript。其中可包含处理 XML 的 ECMAScript(过去称为 JavaScript)。JSX 文件中的功能由 Web Service 进行 XML 映射时调用。WebLogic Workshop 扩展了 ECMAScript 语言,支持将 XML 作为本机类型,从而可以在脚本中直接处理 XML。
如何使用react-tools将jsx编译成JavaScript
使用react-tools将jsx编译成JavaScript方法:
1,通过npm安装react-tools
npm –g react-tools
2,通过cmd进入项目根目录执行watch命令 jsx --watch src/ build/
src路径下存放的是jsx文件,编译后的js存放到build路径下
3,当目标文件变化以后,自动构建生成新的js文件。
js 和 jsx 有什么区别
js就是前端开发语言,jsx是React框架下用的,要在React框架中的编译器编译成js语言才能使用的
jsx是javascript的一种语法扩展吗
对的,JSX就是Javascript和XML结合的一种格式。React发明了JSX,利用HTML语法来创建虚拟DOM。当遇到,JSX就当HTML解析,遇到{就当JavaScript解析。
如下(JS写法)
var child1 = React.createElement('li', null, 'First Text Content');
var child2 = React.createElement('li', null, 'Second Text Content');
var root = React.createElement('ul', { className: 'my-list' }, child1, child2);
等价于(JSX写法)
var root =(
ul className="my-list"
liFirst Text Content/li
liSecond Text Content/li
/ul
);
后者将XML语法直接加入JS中,通过代码而非模板来高效的定义界面。之后JSX通过翻译器转换为纯JS再由浏览器执行。在实际开发中,JSX在产品打包阶段都已经编译成纯JavaScript,JSX的语法不会带来任何性能影响。另外,由于JSX只是一种语法,因此JavaScript的关键字class, for等也不能出现在XML中,而要如例子中所示,使用className, htmlFor代替,这和原生DOM在JavaScript中的创建也是一致的。JSX只是创建虚拟DOM的一种语法格式而已,除了用JSX,我们也可以用JS代码来创建虚拟DOM。