• 关于if简写语句优化的方法


    UglifyJS是一个对javascript进行压缩和美化的工具,在它的文档说明中,我看到了几种关于if语句优化的方法。尽管我还没使用它去 做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作。也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许 会改变看法。

    一、使用常见的三元操作符

    if (foo) bar(); else baz(); ==> foo?bar():baz();
    if (!foo) bar(); else baz(); ==> foo?baz():bar();
    if (foo) return bar(); else return baz(); ==> return foo?bar():baz();

    对于以上使用三元操作符来优化if语句你肯定不会陌生,或许你经常使用它。

    脚本之家给出的例子:


    <script>
    var i=9
    var ii=(i>8)?100:9;
    alert(ii);
    </script>

    输出结果:

    100

    二、使用and(&&)和or(||)运算符

    if (foo) bar(); ==> foo&&bar();
    if (!foo) bar(); ==> foo||bar();

    老实说,我并没有这样去写过代码,这种写法我在学习《鸟哥的 Linux 私房菜》时看到过,但我并没想到在js中实现它。

    三、省略大括号{}

    if (foo) return bar(); else something(); ==> {if(foo)return bar();something()}

    这种写法你我都很熟悉,但我建议在代码优化的时候这样做,或者交给UglifyJS帮你去解决。毕竟少一个大括号,代码的可阅读性并不高。

    写到这里,我想到jQuery之父在《精通 JavaScript》中的一个获取HTML元素属性的方法。

    function getAttr(el, attrName){
    var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName;
    };

    如果我们不这样写,可能我们需借助于两个if语句来进行处理,而上面的代码不仅简洁有效,而且可阅读性强。

    仔细想想,好些时候我们都能找到解决问题的有效途径,但关键在于我们是否用心去寻找一种更好的途径。

    【javascript技巧】if(x==null)简写

    if(x==null)或if (typeof (x) == 'undefined')可以简写为if(!x),未验证。

    反之if(x)表示x非空

    判断对象是否存在


    if(document.form1.softurl9){
    //判断是否存在softurl9,防止js出错
    }

    if(document.getElementById("softurl9")){
    //判断是否存在softurl9,防止js出错
    }



    补充:

    javascript || && 简写 if


    <script type="text/javascript">

        如果你想写
        if (!false)
        {
            alert('false');
        }

        不妨考虑写成:
        false || alert('false');

        false || alert('false'); true || alert('true'); //output false;
        用"||"的情况下,第一个条件true,不检测第二个直接返回true.第一个条件false,会执行第二个条件检测

        false && alert('false'); true && alert('true'); //output true
        用"&&"的情况下,第一个条件true,还会检测第二个条件。第一个条件false,直接返回false退出。

        简而言之, 替换 if 的简单实用, ? : 替换 if else的实用。 写短小精悍的代码

        usage:
        $("#regform input[type!=hidden]").each(
            function(index) {
                $(this).parent().has("div.valid-under").length || $('<div class="valid-under"></div>').appendTo($(this).parent());
            }
        );  
    </script>
  • 相关阅读:
    Notes of Daily Scrum Meeting(12.18)
    Notes of Daily Scrum Meeting(12.17)
    Notes of Daily Scrum Meeting(12.16)
    Notes of Daily Scrum Meeting(12.8)
    Notes of Daily Scrum Meeting(12.5)
    Notes of Daily Scrum Meeting(12.3)
    Notes of Daily Scrum Meeting(11.12)
    Linux中profile、bashrc、bash_profile之间的区别和联系
    Linux GCC编译
    mysql 5.7.16 远程连接
  • 原文地址:https://www.cnblogs.com/houkaihua/p/4571902.html
Copyright © 2020-2023  润新知