Question

有人可以解释这两段代码是如何实现完全相同的东西*或解释为什么它们可能会出现但却没有？

  for (i = 0; i < xx.length; i++) {
    xx[i].classList.remove(...y);
  }

  xx.forEach(x => {
    x.classList.remove(...y);
  });

Answer 1

forEach是Array原型上的一种方法。它遍历数组的每个元素并将其传递给回调函数。

基本上，forEach是用例“将array的每个元素传递给function”的简写方法。以下是一个常见示例，我认为Array.forEach与for循环相比非常有用：

// shortcut for document.querySelectorAll
function $$(expr, con) {
    return Array.prototype.slice.call((con || document).querySelectorAll(expr));
}

// hide an element
function hide(el) {
    el.style.display = 'none';
}

// hide all divs via forEach
$$('div').forEach(hide); 

// hide all divs via for
for (var divs = $$('div'), i = 0; i < divs.length; i++) {
    hide(divs[i])
}

如您所见，与for循环相比，forEach语句的可读性得到了改进。

另一方面，for语句更灵活：它不一定涉及数组。普通for循环的性能稍好一些，因为没有涉及每个元素的函数调用。尽管如此，建议在for语句写入时避免forEach循环。

Answer 2

小心，如果你声明“i”没有“var”关键字，它将是全局的。

您可以查看forEach可以执行的操作： forEach MDN

JavaScript - For loop vs forEach

2 个答案: