javascript - 这是什么 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-now div 上调用。

这样的调用函数叫什么？

编辑:
我应该说我理解三元 if/else，但不理解 $(selector)[f​​unction_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() 接受用于打开和关闭的 bool 参数，所以

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

将以与

相同的方式工作

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

注意我用的是!!为了将值转换为 bool 值，因为切换使用 ===

检查参数