Question

我是JS新手，正在学习如何在JS中创建和使用高阶函数。我对这段代码有些困惑：

function elListMap(transform, list) {
    // list might be a NodeList, which doesn't have .map(), so we convert
    // it to an array.
    return [...list].map(transform);
}

function addSpinnerClass(el) {
    el.classList.add('spinner');
    return el;
}

// Find all the buttons with class 'loader'
const loadButtons = document.querySelectorAll('button.loader');

// Add the spinner class to all the buttons we found.
elListMap(addSpinnerClass, loadButtons);

问题是，当addSpinnerClass本身传递给elListMap时，为什么不将参数传递给addSpinnerClass。我的意思是我们不应该拥有elListMap(addSpinnerClass(loadButtons), loadButtons);而不是elListMap(addSpinnerClass, loadButtons);

Answer 1

loadButtons是元素列表。如果将其传递给addSpinnerClass，它将尝试调用该元素列表的classList.add()方法。

由于它是元素的列表，而不是元素，因此会出错，程序将停止。

如果没有错误，那么您将传递addSpinnerClass的返回值（您传递给它的值：即列表）作为{{1 }}。

elListMap然后将其作为第一个参数传递给elListMap。 map的第一个参数需要是一个函数，但是您将传递一个元素列表。因此，这又会出错。

与JS中使用高阶函数的混淆

1 个答案: