JavaScript的方括号函数调用

Question

在浏览jQuery的源代码，当我遇到这条线：

jQuery(this)[ state ? "show" : "hide" ](); 

是否有过

state ? jQuery(this).show() : jQuery(this).hide(); 

什么优势？

独立例如：

var object = { 
    foo: function() { 
     alert('foo'); 
    }, 

    bar: function() { 
     alert('bar'); 
    } 
}; 


object[true ? 'foo' : 'bar'](); 
object[false ? 'foo' : 'bar'](); 

Answer 1

性能没有优势。但是，如果你的函数中有很多参数，那么代码的长度就有一个优点（如果你认为它是一个优点）和DRY原则（不要重复代码）。

考虑以下几点：

obj[ cond ? "foo" : "bar" ]("param1", "param2", "param3"); 

对战：

cond ? obj.foo("param1", "param2", "param3") : obj.bar("param1", "param2", "param3"); 

正如你所看到的，你在第二种方式

希望这有助于重复的代码 '很多'。干杯

Answer 2

是否有任何优点

否，稍短于其他代码，并且不重复jQuery(this).

然而重复可以通过声明来减轻例如首先是$this。

我没有发现这种模式特别容易阅读，所以我自己唯一使用它的方式就是如果参数列表不重要，并且不依赖于哪个方法被调用。

Answer 3

jQuery方式更简洁，坚持DRY原则。我认为这是第二个例子的主要优势。

Answer 4

在你的榜样，有

jQuery(this)[ state ? "show" : "hide" ](); 

和

state ? jQuery(this).show() : jQuery(this).hide(); 

但是没有任何区别，广场可用于调用一个函数没有它的名字：

var myFunctionName = 'show'; 
jQuery(this)[ myFunctionName ](); 

为什么这很有用？在上面的例子中，它完全没用。但是，我们可以找到某些情况下它可能是不错的：

// list of available methods 
var effects = [ 'hide', 'slideUp', 'fadeOut' ]; 

// get a random index between 0 and effects.length-1 (2 in this case) 
var randomIndex = Math.floor(Math.random() * (effects.length)); 

// get the method name 
var methodToCall = effects[ randomIndex ]; 

jQuery(this)[ methodToCall ](); 

这个片段将选择一个随机的方法，并呼吁在jQuery的对象方法。这不是很好吗？:)

Answer 5

为了，我的排名：

1. 可靠的代码按预期工作（没有解决方案的马车希望）
2. 代码是可读的，易维护的（缺乏可读性和可维护性的滋生虫子并减缓发展的步伐）
3. 代码为DRY（重复是坏的可读性，可维护性，有时性能）
4. 代码是短（如果它实现了上述所有的东西，通常越短越好）为

我与jQuery(this)[ state ? "show" : "hide" ]();的问题在于，它不是一种常见的设计模式，很多人习惯于习惯于阅读和习惯阅读。因此，它不是超级可读的，并且很容易混淆未来维护这些代码的人（导致错误）。正如我上面显示的优先事项，如果两者不一致，我会优先考虑DRY的可读性。

在这种情况下，我可能会写：

var $this = jQuery(this); 
state ? $this.show(): $this.hide(); 

还不如短，但在我看来更具有可读性。