前端有多少工作是能用到 AST 的

2022-12-28 09:03:38 +08:00
 YadongZhang

目前遇到常用 AST 的场景还是开源库 Storybook ,会用到 jscodeshift ,mdx 和 babel 相关的 AST 工具。

不过日常开发 Figma 切图还是主要工作.

有哪些公司或者部门会经常用到相关领域知识? 或者说大家都是写业务代码的,不是 Core Team (比如写组件的)就不会用到 AST ?

举个例子,代码重构写 Codemod 才会用到 AST 相关工具。

纯交流,只是觉得这个东西有意思而已

6345 次点击
所在节点    程序员
42 条回复
Geo200
2022-12-28 11:05:03 +08:00
普通业务用不到,涉及架构优化、源码管理、构建性能提升的时候会用到
Echoldman
2022-12-28 11:16:24 +08:00
我用 ast 的方式解析后端 php 的代码,获取到数据接口的字段名和标题,然后用这个来生成前端代码
yl20181003
2022-12-28 11:20:23 +08:00
公司的微前端框架,以及权限部分有用到
rick2c
2022-12-28 11:26:03 +08:00
我做 i18n 的 key 自动收集
lopda
2022-12-28 11:28:23 +08:00
@duan602728596 大佬,有就 [新闻行业,发文章后会有敏感词检测并高亮,将 html 解析成 AST ,找到并标记敏感词。] 写过相关文章吗。想了解学习下
retrocode
2022-12-28 11:31:10 +08:00
我是目前只在开发自定义 eslint 规则时有用到, 主要是适配项目自有校验和通用的代码修复
duan602728596
2022-12-28 11:43:45 +08:00
@lopda 因为这个是公司业务强相关的,所以没有相关文章。
因为文章是 html 的格式的,在文章发布前会通过 api 检查是否有敏感词并返回敏感词数组,然后本地使用 parse5 将 html 解析成 AST ,在 AST 中查找敏感词。AST 的遍历参考了 babel 的实现方法,通过不同的插件实现实现不同的功能。
以政治类新闻中的领导人名称为例,假设领导人名为 CKQ 。可能会出现<div><span>C</span><b>K</b></div><span>Q</span>这种情况,光靠正则不太够用,而且不太好做标记。就会用 AST 来查找并标记。
jones2000
2022-12-28 11:51:29 +08:00
一直都用 AST , 都自己写的,大学上过编译原理的,这个东西不难。AST 做完以后, 直接把 AST 转成 c++代码或其他平台代码,就可以自动跨语言移植了
liuidetmks
2022-12-28 11:55:40 +08:00
我能想到的就是逆向 js 可能有用
CocaColf
2022-12-28 12:15:27 +08:00
普通业务中很少有用到的场景吧,一般都在基建相关的代码里才会用到。我用到的场景一般是 eslint plugin 、将某种形式的文件转为另一种、解析 js 代码提取信息、代码片段自动重构。比如这个寻找改动文件和函数影响面的小项目: https://github.com/CocaColf/coderfly
qieqie
2022-12-28 12:19:02 +08:00
代码编辑器上的高亮 /lint ,web 终端上的 sh 脚本、sql 自动补全
AmiKara
2022-12-28 13:57:24 +08:00
当业务需要理解语言含义的时候就要用到 AST
loloxwg
2022-12-28 14:15:46 +08:00
数据库,sql 解析的时候会用
liaozzzzzz
2022-12-28 20:20:40 +08:00
一般场景就是做些工具类的吧,构建工具的插件或者 babel 、eslint 这些的插件,或者就是些 codemod 工具,业务上基本上基本就没用到了
hamsterbase
2022-12-28 22:38:05 +08:00
1. 分析 ast ,自动提取出 i18n 的 key 和 message

2. 稍后读软件,为了开发一个完美的模板引擎,自己解析 ast 和写解释器。

3. 写 ast 转换器,把 js 翻译成 rust.

4. 解析器,根据代码注释自动生成 API 文档
nong99
2022-12-29 00:46:07 +08:00
菜鸡的我居然不知道 AST 是啥…
cabbage
2022-12-29 02:04:33 +08:00
碰到正则没办法很好解析的 *结构化* 语言文本,解析起来就需要走 AST 。

有复杂 DSL 需求可以看看 ANTLR4 ,比如上面有坛友说的低代码平台的例子,可能会需要实现奇形怪状的 SQL 方言,或者某些业内特定的脚本语言等等。相比人肉手撸 lexer/parser ,用 antlr 写一组 g4 语法树文件可以自动生成 lexer/parser ,更快更简单也不容易出 bug ,还支持好多语言 java/py/cpp/js ,另外还有 debugger 可以用来调试。

虽然我是后端的,不过 g4 文件写完了也会给前端,用同一个语法树给前端生成 js 的 lexer 和 parser ,前端再去做语法检查、补全提示之类的功能。
ccyu220
2022-12-29 08:06:19 +08:00
上面很多人说的这个 AST 和我理解的好像不太一样。

按这个标准,我自己写的 JSON to TS interface 也是 AST 了?

我可不这么认为。
qingshui33
2022-12-29 09:14:15 +08:00
看了一圈,原来都是大佬,就我一个菜鸡
LindsayZhou
2022-12-29 12:27:41 +08:00
@ccyu220 #38
是的,我也这么觉得,虽然我不是前端。
我感觉他们在说 分析树 而不是 抽象语法树

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/905062

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX