带有 2 组括号（圆括号）的 Javascript For 循环 - FOR ()()

Question

我刚刚从某个地方得到了一个代码，我试图理解它。但是我卡在了一个我无法理解的地方。 Javascript代码如下：

for(t_var=0,n_var=i_var.length; t_var<n_var; t_var++)
  (e_var=i_var[t_var])[0]
    .removeEventListener(e_var[1],d_var)

这是一个单行 javascript for 循环。我无法理解第二组圆括号的使用，即包含 (e_var=i_var[t_var])。我认为它可能正在创建某种数组，因为第二组括号后的 [0] 将其显示为数组。但我不确定它的具体用途是什么？

有人可以帮忙吗？

问候

Answer 1

您可以按以下方式重写代码以使其更易于理解：

for(t_var=0,n_var=i_var.length; t_var<n_var; t_var++)(e_var=i_var[t_var])[0].removeEventListener(e_var[1], d_var);

// on multiple lines
for (t_var = 0, n_var = i_var.length; t_var < n_var; t_var++)
  (e_var = i_var[t_var])[0].removeEventListener(e_var[1], d_var);

// using a for-loop with curly brackets
for (t_var = 0, n_var = i_var.length; t_var < n_var; t_var++) {
  (e_var = i_var[t_var])[0].removeEventListener(e_var[1], d_var);
}

// splitting assignment and event listener removal
for (t_var = 0, n_var = i_var.length; t_var < n_var; t_var++) {
  e_var = i_var[t_var];
  e_var[0].removeEventListener(e_var[1], d_var);
  // ^ the expression `(e_var = i_var[t_var])` returns the value assigned to `e_var`
}

// removal of array length caching to make the loop more readable
for (t_var = 0; t_var < i_var.length; t_var++) {
  e_var = i_var[t_var];
  e_var[0].removeEventListener(e_var[1], d_var);
}

// more descriptive variable names
for (index = 0; index < array.length; index++) {
  arrayElement = array[index];
  arrayElement[0].removeEventListener(arrayElement[1], eventListener);
}

// using destructuring assignment
for (index = 0; index < array.length; index++) {
  arrayElement = array[index];
  const [htmlElement, eventType] = arrayElement;
  htmlElement.removeEventListener(eventType, eventListener);
}

// using for...of instead of standard for-loop
for (const [htmlElement, eventType] of array) {
  htmlElement.removeEventListener(eventType, eventListener);
}

请注意，您的示例未使用var、let 或const 来定义变量。除了我介绍的新变量之外，上面的更改也没有使用这些更改。通常变量应该总是使用 3 个关键字中的一个来定义（最好是 let 或 const），否则变量是全局的。全局变量通常会导致意外行为，从而导致错误。