JavaScript 和 jsx 区别是什么? 下面本篇文章就来给大家介绍一下 JavaScript 和 jsx 区别, 希望对大家有所帮助.
JSX, 即 JavaScript xml, 一种在 React 组建内部构建标签的类 xml 语法.(增强 React 程序组件的可读性)
JavaScript 和 jsx 区别:
1, 浏览器只能识别普通的 JavaScript, 普通的 CSS, 并不能识别 SCSS,jsx(SCSS 是 CSS 的拓展, jsx 可以看做是 JS 的拓展), 所以 webpack 的作用是把 SCSS 转换为 CSS, 把 jsx 转换为浏览器可以识别的 JS, 然后浏览器才能正常使用;
2,JavaScript 就是本身并不支持 react 里面的 jsx(也就是在 JS 文件里面直接写 html 那种), 现在他们可以直接写是因为编辑器可以选择语言的解析模式了 (待会截图给你看), 编辑器正确显示是因为 虽然是. JS 文件, 编辑器用了. jsx 的解析模式, 所以显示正确
3,.jsx 文件会自动触发编辑器以 jsx 的模式解析当前的文件, 所以可以更不会出错.
JSX 语法, 像是在 JavaScript 代码里直接写 xml 的语法, 实质上这只是一个语法, 每一个 xml 标签都会被 JSX 转换工具转换成纯 JavaScript 代码, React 官方推荐使用 JSX, 当然你想直接使用纯 JavaScript 代码写也是可以的, 只是使用 JSX, 组件的结构和组件之间的关系看上去更加清晰.
看代码:
示例代码 https://www.html.cn/archives/5632#more-5632
那么也就是说, 我们写一个 xml 标签, 实质上就是在调用 React.createElement_x_x_x_x 这个方法, 并返回一个 ReactElement 对象.
来源: http://www.css88.com/qa/javascript/11388.html