V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
3dwelcome
V2EX  ›  前端开发

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

  •  
  •   3dwelcome · 2021-06-18 16:04:02 +08:00 · 2600 次点击
    这是一个创建于 426 天前的主题,其中的信息可能已经有所发展或是发生改变。

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

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

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

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

    28 条回复    2021-07-16 15:13:17 +08:00
    Rrrrrr
        1
    Rrrrrr  
       2021-06-18 16:04:54 +08:00   ❤️ 1
    ???
    murmur
        2
    murmur  
       2021-06-18 16:06:27 +08:00
    jsx 代码精炼?笑了,跟模板还差一点,完全是开发者偷懒,然后搞出一堆所谓借口,然后被前端一顿吹

    vue 支持 jsx,vue 里写的是 class 不是 className,从亘古开始,html 里写的就是 class,什么时候写过 className
    murmur
        3
    murmur  
       2021-06-18 16:07:58 +08:00
    *vue 就算是 jsx 语法写的也是 class
    meteor957
        4
    meteor957  
       2021-06-18 16:08:23 +08:00
    @murmur 你这个『亘古』给我看笑了
    3dwelcome
        5
    3dwelcome  
    OP
       2021-06-18 16:10:15 +08:00
    @murmur JSX 就是为了脱离模板自定义语法,把组件做成库,任何 JS 环境都能调用。

    而 VUE 那种对模板语法有很大修改的入侵式框架,写出来的组件,只能给 VUE 自家来用,移植性不好。
    murmur
        6
    murmur  
       2021-06-18 16:11:49 +08:00
    @3dwelcome jsx 是标准 js 和 html 语法么,不是,需要 loader 么,需要

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

    和 html 一样的语法,模板 if 、模板 for,这些东西属于可以不用,但是必须得有
    shintendo
        7
    shintendo  
       2021-06-18 16:17:57 +08:00
    缓缓打出一个问号,嵌后端代码和嵌前端代码是一回事吗……
    3dwelcome
        8
    3dwelcome  
    OP
       2021-06-18 16:19:41 +08:00
    @murmur 模板 IF/FOR 都是对于 HTML 模板的扩展,又不像 JS 有标准可循,大厂都希望发明自己的语法,毕竟 VUE 距离一统天下,还很遥远。

    而且代码写好后,大部分人都懒得修改。很多年后你的 VUE 模板写法也许跟着框架升级变了,可是 JS 是不会变的。
    littleylv
        9
    littleylv  
       2021-06-18 16:20:10 +08:00
    是是是,你说的都对
    Leviathann
        10
    Leviathann  
       2021-06-18 16:25:28 +08:00 via iPhone
    后端语言明显是被 xml 搞恶心了
    以至于开发的用来写页面的 dsl 都刻意避开 xml
    比如 kotlin 和 rust
    sunjourney
        11
    sunjourney  
       2021-06-18 16:25:34 +08:00   ❤️ 1
    @murmur #6 半桶水说话就不要这么自信了好么
    ragnaroks
        12
    ragnaroks  
       2021-06-18 16:36:09 +08:00
    不是 jsx 大火,是模板引擎
    shintendo
        13
    shintendo  
       2021-06-18 16:36:29 +08:00   ❤️ 2
    @3dwelcome 大家都是 render funtion 的语法糖,大家也都不是标准,为啥一个就比另一个移植性高了
    3dwelcome
        14
    3dwelcome  
    OP
       2021-06-18 16:46:56 +08:00
    @shintendo 因为 JSX 代码可以写成库,在别的框架里,都可以随便调用。

    可是模板里写了 V-IF,就只有 VUE 框架能认识。
    ragnaroks
        15
    ragnaroks  
       2021-06-18 16:54:59 +08:00
    @shintendo 正解

    @3dwelcome vue 项目也是可以打包成单个.es 或.js 的,比如 vue-toast,打包后的单个 js 文件的内容其实就是各种 createElement
    ragnaroks
        16
    ragnaroks  
       2021-06-18 16:56:14 +08:00
    sof 上有如何使用 react 和 vue 编写油猴脚本的教程,你自己搜看下就明白了
    Jirajine
        17
    Jirajine  
       2021-06-18 16:57:51 +08:00 via Android
    这个真不一样,最大的区别是动态化。后端语言里套的是模板,数据更新了就得重新请求整个页面。而 jsx 写的是交互式、响应式的完整应用。
    Shy07
        18
    Shy07  
       2021-06-18 17:02:50 +08:00 via iPhone
    “ JSX 是 JS 里嵌套 HTML 标签,和 PHP 的 HTML 标签里嵌套代码,两者有点殊途同归的感觉。”


    楼主再仔细想想真的是殊途同归,而不是背道而驰?
    mxT52CRuqR6o5
        19
    mxT52CRuqR6o5  
       2021-06-18 17:03:33 +08:00 via Android
    一个是拼字符串,一个是语法糖,差多了
    DOLLOR
        20
    DOLLOR  
       2021-06-18 17:30:13 +08:00
    如果你觉得“殊途同归”,那就说明你肯定也不懂 Object 和 JSON 的区别。
    3dwelcome
        21
    3dwelcome  
    OP
       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
        22
    Jirajine  
       2021-06-18 18:44:31 +08:00 via Android
    @3dwelcome 这样用显然不是“后端语言”。
    nodejs 和浏览器里的 js 是不同的东西。
    wanguorui123
        23
    wanguorui123  
       2021-06-18 19:02:07 +08:00 via iPhone
    我最讨厌在 XML 里写一堆判断和控制逻辑语法,JSX 这种代码堆久了,写法不克制,维护只会越来越麻烦
    Desiree
        24
    Desiree  
       2021-06-18 19:43:46 +08:00
    引战帖,鉴定完毕
    otakustay
        25
    otakustay  
       2021-06-18 19:52:26 +08:00
    @murmur 那啥,jsx 不需要 loader,需要 babel 插件……你可别说得好像用些 ES 的新语法也要 babel-loader 最后为什么 ES 不多做一些
    akira
        26
    akira  
       2021-06-18 21:35:36 +08:00
    和 php 没啥关系,以前的 asp jsp 还不是一样的各种 html 到处飞。 只能说,人都是趋于偷懒的写法的
    Cbdy
        27
    Cbdy  
       2021-06-19 15:50:41 +08:00
    @murmur

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

    另一方面,React 的 JSX 用 class 不能用吗?可以用的大兄弟,React 没有规定一定要用 className
    shilianmlxg
        28
    shilianmlxg  
       2021-07-16 15:13:17 +08:00
    又想到之前认识一个“大佬”
    因自己写 jsp
    所以自己的职位定义的是全栈
    关于   ·   帮助文档   ·   API   ·   FAQ   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   4111 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 42ms · UTC 09:47 · PVG 17:47 · LAX 02:47 · JFK 05:47
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.