写了个反编译 JavaScript 的 babel 插件

先上项目地址： https://github.com/gzzhanghao/babel-plugin-transform-beautifier

用js-beautifier反编译出来的代码长这样：

function _scrollToView(a) {
  var b = this, c = b.listItems.eq(b.currentFocus), d = b.list.scrollTop(), e = c.height(), f = c.position().top, g = Math.abs(f), h = b.list.height();
  return "search" === a ? e > h - f ? b.list.scrollTop(d + (f - (h - e))) :-1 > f && b.list.scrollTop(f - e) :"up" === a ? -1 > f && b.list.scrollTop(d - g) :"down" === a && e > h - f && b.list.scrollTop(d + (g - h + e)), 
b;
}

先通过babel-plugin-transform-beautifier再用js-beautifier反编译出来的代码长这样：

function _scrollToView(a) {
  var b = this;
  var c = b.listItems.eq(b.currentFocus);
  var d = b.list.scrollTop();
  var e = c.height();
  var f = c.position()
      .top;
  var g = Math.abs(f);
  var h = b.list.height();

  if ("search" === a) {
    if (e > h - f) {
      b.list.scrollTop(d + (f - (h - e)));
    } else if (-1 > f) {
      b.list.scrollTop(f - e);
    }
  } else if ("up" === a) {
    if (-1 > f) {
      b.list.scrollTop(d - g);
    }
  } else if ("down" === a && e > h - f) {
    b.list.scrollTop(d + (g - h + e));
  }

  return b;
}

代码片段取自这里 。

使用方法

先用 npm 安装：

npm i --save-dev babel-plugin-transform-beautifier

然后给 babel 加上对应 plugin 就好：

{
    plugins: ['transform-beautifier'],
}

注意： 插件只负责正常 beautifier 不做的事，也就是说要反编译一份代码我们需要先让它通过babel-plugin-transform-beautifier再通过js-beautifier。

How it works

插件的主要作用是通过各种转换把js-beautifier不做的事情给做了，比如把 SequenceExpression 拆成多个 Statement ，还有就是把 LogicalExpression 和 ConditionalExpression 转换成 IfStatement 。

比如下面的代码：

a = b, a() && b ? c() : d()

经过转换会变成：

a = b
if (a() && b) {
    c()
} else {
    d()
}

除此之外还有很多转换规则，这里不一一列举。