ES6 代码转成 ES5 代码的实现思路是什么

把 ES6 代码转成 ES5 代码的实现思路可以分成三步:

  • 打开冰箱
  • 把大象装进去
  • 关上冰箱

喔,不对,原谅我开了个玩笑,嗯,有点冷……

回到正题上来,说到 ES6 代码转成 ES5 代码,我们肯定会想到 Babel。所以,我们可以参考 Babel 的实现方式。

那么 Babel 是如何把 ES6 转成 ES5 呢,其大致分为三步:

  • 将代码字符串解析成抽象语法树,即所谓的 AST
  • 对 AST 进行处理,在这个阶段可以对 ES6 代码进行相应转换,即转成 ES5 代码
  • 根据处理后的 AST 再生成代码字符串

基于此,其实我们自己就可以实现一个简单的“编译器”,用于把 ES6 代码转成 ES5。

比如,可以使用 @babel/parser 的 parse 方法,将代码字符串解析成 AST;使用 @babel/core 的 transformFromAstSync 方法,对 AST 进行处理,将其转成 ES5 并生成相应的代码字符串;过程中,可能还需要使用 @babel/traverse 来获取依赖文件等。对此感兴趣的可以看看这个

如果有误,希望可以帮忙指出来,多谢。

发布了229 篇原创文章 · 获赞 80 · 访问量 41万+

猜你喜欢

转载自blog.csdn.net/qq_34629352/article/details/104872963
今日推荐