随着 JSX 大火，是不是意味着前端重新发明了 PHP 语言？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 1252 天前的主题，其中的信息可能已经有所发展或是发生改变。

React JSX 以代码精炼著称，但 XML 又没有版权，各种框架纷纷效仿。

JSX 是 JS 里嵌套 HTML 标签，和 PHP 的 HTML 标签里嵌套代码，两者有点殊途同归的感觉。

前端发展了那么多年，最终还是没能逃出 PHP 语法的影子嘛。

有人会说 PHP 是后端语言不一样，但其实随着这些年 WASM 普及，前端早就可以嵌入 PHP 了。

28 条回复 • 2021-07-16 15:13:17 +08:00

Rrrrrr

2021-06-18 16:04:54 +08:00

???

murmur

2021-06-18 16:06:27 +08:00

jsx 代码精炼？笑了，跟模板还差一点，完全是开发者偷懒，然后搞出一堆所谓借口，然后被前端一顿吹

vue 支持 jsx，vue 里写的是 class 不是 className，从亘古开始，html 里写的就是 class，什么时候写过 className

murmur

2021-06-18 16:07:58 +08:00

*vue 就算是 jsx 语法写的也是 class

meteor957

2021-06-18 16:08:23 +08:00

@murmur 你这个『亘古』给我看笑了

3dwelcome

2021-06-18 16:10:15 +08:00

@murmur JSX 就是为了脱离模板自定义语法，把组件做成库，任何 JS 环境都能调用。

而 VUE 那种对模板语法有很大修改的入侵式框架，写出来的组件，只能给 VUE 自家来用，移植性不好。

murmur

2021-06-18 16:11:49 +08:00

@3dwelcome jsx 是标准 js 和 html 语法么，不是，需要 loader 么，需要

既然需要 loader，为啥不多做一点

和 html 一样的语法，模板 if 、模板 for，这些东西属于可以不用，但是必须得有

shintendo

2021-06-18 16:17:57 +08:00

缓缓打出一个问号，嵌后端代码和嵌前端代码是一回事吗……

3dwelcome

2021-06-18 16:19:41 +08:00

@murmur 模板 IF/FOR 都是对于 HTML 模板的扩展，又不像 JS 有标准可循，大厂都希望发明自己的语法，毕竟 VUE 距离一统天下，还很遥远。

而且代码写好后，大部分人都懒得修改。很多年后你的 VUE 模板写法也许跟着框架升级变了，可是 JS 是不会变的。

littleylv

2021-06-18 16:20:10 +08:00

是是是，你说的都对

Leviathann

2021-06-18 16:25:28 +08:00 via iPhone

后端语言明显是被 xml 搞恶心了
以至于开发的用来写页面的 dsl 都刻意避开 xml
比如 kotlin 和 rust

sunjourney

2021-06-18 16:25:34 +08:00

@murmur #6 半桶水说话就不要这么自信了好么

ragnaroks

2021-06-18 16:36:09 +08:00

不是 jsx 大火，是模板引擎

shintendo

2021-06-18 16:36:29 +08:00

@3dwelcome 大家都是 render funtion 的语法糖，大家也都不是标准，为啥一个就比另一个移植性高了

3dwelcome

2021-06-18 16:46:56 +08:00

@shintendo 因为 JSX 代码可以写成库，在别的框架里，都可以随便调用。

可是模板里写了 V-IF，就只有 VUE 框架能认识。

ragnaroks

2021-06-18 16:54:59 +08:00

@shintendo 正解

@3dwelcome vue 项目也是可以打包成单个.es 或.js 的，比如 vue-toast，打包后的单个 js 文件的内容其实就是各种 createElement

ragnaroks

2021-06-18 16:56:14 +08:00

sof 上有如何使用 react 和 vue 编写油猴脚本的教程，你自己搜看下就明白了

Jirajine

2021-06-18 16:57:51 +08:00 via Android

这个真不一样，最大的区别是动态化。后端语言里套的是模板，数据更新了就得重新请求整个页面。而 jsx 写的是交互式、响应式的完整应用。

Shy07

2021-06-18 17:02:50 +08:00 via iPhone

“ JSX 是 JS 里嵌套 HTML 标签，和 PHP 的 HTML 标签里嵌套代码，两者有点殊途同归的感觉。”

楼主再仔细想想真的是殊途同归，而不是背道而驰？

mxT52CRuqR6o5

2021-06-18 17:03:33 +08:00 via Android

一个是拼字符串，一个是语法糖，差多了

DOLLOR

2021-06-18 17:30:13 +08:00

如果你觉得“殊途同归”，那就说明你肯定也不懂 Object 和 JSON 的区别。

3dwelcome

2021-06-18 18:16:12 +08:00

@Jirajine "后端语言里套的是模板，数据更新了就得重新请求整个页面。"

时代变了，你可能不太清楚，现在 HTML 可以和 PHP 混写。

<script type = "text/php">
<?php echo "Hello, world!";?>
</script>

只需要 npm install php-wasm, 就那么简单

Jirajine

2021-06-18 18:44:31 +08:00 via Android

@3dwelcome 这样用显然不是“后端语言”。
nodejs 和浏览器里的 js 是不同的东西。

wanguorui123

2021-06-18 19:02:07 +08:00 via iPhone

我最讨厌在 XML 里写一堆判断和控制逻辑语法，JSX 这种代码堆久了，写法不克制，维护只会越来越麻烦

Desiree

2021-06-18 19:43:46 +08:00

引战帖，鉴定完毕

otakustay

2021-06-18 19:52:26 +08:00

@murmur 那啥，jsx 不需要 loader，需要 babel 插件……你可别说得好像用些 ES 的新语法也要 babel-loader 最后为什么 ES 不多做一些

akira

2021-06-18 21:35:36 +08:00

和 php 没啥关系，以前的 asp jsp 还不是一样的各种 html 到处飞。只能说，人都是趋于偷懒的写法的

Cbdy

2021-06-19 15:50:41 +08:00

@murmur

一方面，自古以来没有写过 className ？那 HTMLElement.prototype.className 是啥？ HTMLLabelElement.prototype.htmlFor 是啥？

另一方面，React 的 JSX 用 class 不能用吗？可以用的大兄弟，React 没有规定一定要用 className

shilianmlxg

2021-07-16 15:13:17 +08:00

又想到之前认识一个“大佬”
因自己写 jsp
所以自己的职位定义的是全栈