Question

我发现自己写了很多类似的代码：

$('.selector').addClass(condition ? 'class' : '');

我知道这可能是愚蠢和愚蠢的，但我只是好奇，如果有一种方法可以做到这一点没有Javascript中的错误条件。我环顾四周，并没有找到任何可以做到这一点的操作员，但我可能（并希望我）错了。

我不一定要优化我的代码，这只是好奇心：）

感谢。

Answer 1

JavaScript的&&运营商short-circuits。您将看到许多脚本和库中常用的类似内容：

condition && $('.selector').addClass('class');

或者正如mgibsonbr的评论所述，你可以在方法本身内简单地&&：

$('.selector').addClass(condition && 'class');

但是，它不那么直观了，因为当{值1}}在JavaScript中导致a && b时，两个值都是真正的，而不是b与其他语言不同，这并不是一个众所周知的事实。

Answer 2

!condition || func();  // launch func only if condition holds

如果condition为false，则!condition为真。由于||的第一个操作数为true，因此整个表达式为真。 func()被短路而未被召唤。

如果condition为真，则!condition为false，因此必须调用func()才能评估析取。

Answer 3

您可以编写自己的jQuery monadic操作。虽然它应该非常谨慎地使用（以减少$。*命名空间的混乱），但如果你这么做的话，这仍然是最优雅的方式。

(function($) {
    $.fn.addClassIf = function() {  
        var args = Array.prototype.slice.call(arguments, 0, -1);
        var condition = Array.prototype.slice.call(arguments, -1)[0];

        return condition ? this.addClass.apply(this,args) : this;
    };
})(jQuery);

演示：

> $('body')
[<body class="question-page">…</body>]

> $('body').addClassIf('test1', true)
[<body class="question-page test1">…</body>]

> $('body').addClassIf('test2', false)
[<body class="question-page test1">…</body>]

> $('body').addClassIf('test3', true)
[<body class="question-page test1 test3">…</body>]

是否有内联运算符只在值为true时才执行某些操作？

3 个答案: