这是什么JavaScript/JQuery语法？

Question

我不知道如何搜索这个,所以我在这里问.

我继承了一个项目,没有人知道这个语法技巧是什么.

如果从列表中选择了一个或另一个特定值,则会有一个选择下拉更改事件来调用函数.

$('#accordion select[name=x_range]').change(function(){
  $('#custom-time')[$(this).val() == 'custom' ? 'show' : 'hide']();
  $('#custom-time-to-now')[$(this).val() == 'custom_to_now' ? 'show' : 'hide']();
  updateTimeIntervalOptions();
}).triggerHandler('change');

在这里,在#custom-time或#custom-time-to-nowdiv 上调用show或hide函数.

什么叫这样的函数叫做？

编辑:
我应该说我理解三元if/else,但不是$(selector)[function_name]()部分.

Answer 1

我会说这不是一个技巧,而是了解javascript的三个功能.

首先,函数是第一类对象,因此您可以将它们分配给变量等

 var f = function () { ... }
 var b = [];
 b[1] = f; // assigning function to array element
 b[1]();   // calling function assigned to array element

第二,方便的三元运算符,它有效地简化了组合if和分配的符号:

 var a = (b >c ) ? b : c;

 // is the same as

 if (b > c ) {
     a = b;
 } else {
     a = c;
 }

最后但并非最不重要的是,每个对象属性都可以作为字典元素访问,即

 a.b = 5
 a['b'] === 5 // true! 

所以把所有这些放在一起你可以有这样的表达

$(selector)[condition?'show':'hide']();

这相当于

if (condition) {
   $(selector).show();
} else {
   $(selector).hide();
}

更新:关于这个特例的一个注释.在大多数情况下,你不需要做那样复杂的事情,因为$().toggle()接受boolean参数来打开和关闭,所以

$(selector)[condition?'show':'hide']();

将以同样的方式工作

$(selector).toggle(!!condition);

注意我用!! 为了将值转换为布尔值,因为切换检查参数使用===

Answer 2

什么叫这样的函数叫做？

编码习惯不佳.

这是一个方法调用show()或hide()动态功能.这是一种血腥的讨厌的样子.

编辑:显然我的回答对某些人来说是"有争议的".请让我澄清一下:如果我能在三元运算符上写if-else语句 - 特别是对于字符串比较这样的事情 - 我肯定会清楚更短的代码.

它不是"血腥讨厌的外观",因为只有三元运算符或只是方法的括号访问.这是一种血腥讨厌的看法,因为代码采用了清晰度的快捷方式,并在不需要时采用了这种快捷方式.

三元运营商也不错.支架访问也不错.但它们是容易被滥用的易变性概念.

Answer 3

显然它叫做Bracket Notation