• UglifyJS-- 对你的js做了什么


    也不是闲着没事去看压缩代码,但今天调试自己代码的时候发现有点意思。因为是自己写的,虽然压缩了,格式化之后还是很好辨认。当然作为min的首要准则不是可读性,而是精简。那么它会尽量的缩短代码,尽量的保持一行,最大化的减少的空白。我们常用的分号都会被替换成了逗号,短句变成了连贯的长句。

    1.立即执行函数

    我本是第二种写法,uglify给我替换成了第一种(当然更短一点)。其实括号和!号的作用都是将funtion的部分转成一个表达式,而不再是申明。这样就能立即执行,同理~   +都可以做到。

    2.变量名替换

    这个是自然的,函数名、参数名、变量名都替换成了单个字母。甚至是‘_’

    3.函数置顶

    function foo (){} 这种形式的代码都会被放到模块的最顶端。当然这是一种规范,后来发现还有另外一个作用就是方便后面的代码合并。 比如 我们这样定义:
    var self=this;
    function a(){}
    self.a=a;
    function b(){}
    self.b=b;
    return self;

    会替换成:

    function a(){}
    function b(){}
    var s={}
    return  s.a={},s.b={},s

    注意到最后的s 不能漏了,return会以最后一个表达式的结果为准。

      function rt(n) {
        return n;
       }
      function xx() {
          return rt(1), rt(2);
      }

    执行xx()得到的是2,如果 rt(2)后面还有个不返回值的函数执行,那么xx()会得到undefined。

    4.bool值替换

    false-->!1  true-->!0

    5.if 

    if语句是压缩最多的地方。

    1) return 前置:
     function load() {
                if (t) {
                    x = false;
                    log("error");
                    return;
                }
                console.log("22")
            }

    比如我的原函数大概是这样。压缩后成了这样:

      if (t) return x =!1,void log("error")
    return提前了,末尾多了一个void。 这是为什么呢。 没有大括号,if的四段代码变成了一句话。void的在这里的作用是抹掉函数的返回值。因为本来的这个if 是没有返回值的 。如果这个时候log方法带有返回值。那么调用load就会拿到这个返回值。这会产生干扰,违背了原函数的本意。所以用void抹掉了。 
    2) 短路
         function foo() {
                if (!x) {
                    return;
                }
                console.log("doA");
                console.log("doB");
      }

    压缩后:

        function f() {
                x || console.log("doA"), console.log("doB");
          }

    这样蛮不错的。同理:

    if(x&&y){
    doa();
    dob();
    }
    doc();
    --> x&&y&&(doa(),dob()),doc()

    原本四行变成了一行代码。

    3).为了合并一行,这也行:

        console.log("doA");
        console.log("doB");
         if (x>0) {
             console.log("true");
          }

    合并成这样:

     if (console.log("doA"), console.log("doB"), x > 0) console.log("true");

    平时这么写可能不太友好,重点是在if语句中,最后一句才是判断句。结合之前的return。想必对逗号语句有了深刻的认识。

    4)throw也不放过

     if (errMsg) {
           util.triggerCallback(fail, "模型验证错误");
           throw Error(errMsg);
      }

    压缩后:

     if (a)  throw x.triggerCallback(o, "模型验证错误"), Error(a)

    调换了语句的顺序,把throw看成return 就明白了。

    5) if else

    这个会替换成三元表达式  a?b:c 。

    6.数字处理

    整百整千的会处理成科学计数 1000 -->1e3 。

    7. while

    var offset = 0;
                while (true) {
                    if (offset >= bufferLength) {
                        break;
                    }
    }

    会替换成这样:

      for (var n = 0; ; ) {
                    if (n >= K)
                        break
     }

    确实不错,节省了一行代码。

    以上只是独自对比自己的代码发现的一些东西,有的可以在平时的编码中用起来,当然不是追求所有代码都写成一行,这样可读性比较差,另外可能你下次看压缩代码就不那么费劲了。欢迎补充。

  • 相关阅读:
    java 24
    java 24
    java 24
    java 24
    一个用httpPost,get访问外网接口,参数json,返回json的示例
    几个强大的oracle自带函数,可根据日期算年纪,根据数值匹配字段
    sql对日期的处理,一个存储过程示例
    一条sql,有分页,表合并查询,多表连接,用于oracle数据库
    后台返回data直接在页面转换
    JQuery的$和其它JS发生冲突的快速解决方法
  • 原文地址:https://www.cnblogs.com/stoneniqiu/p/7240632.html
Copyright © 2020-2023  润新知