Question

所以基本上我写了这个JS函数来过滤来自网络论坛的一些帖子内容。

    const postFilter = (vector) => {
        vector.forEach(e => {
            e.innerHTML.toLowerCase().match(/word1|word2|word3/g) ? e.style.display = 'none' : false;
        });
    }

    postFilter(document.getElementById('threadbits_forum_2').querySelectorAll('tr'));

这是我的问题：

foreach方法功能是否友好？那么正则表达式呢？如果我将正则表达式声明为常量，那么它仍然是纯函数吗？

Answer 1

如果我将正则表达式声明为常量，它将仍然是纯函数？

使用常量的函数是纯函数。这是“只是另一个功能参数”。考虑一下等于隐藏函数组成的常量。

伪代码：

func a(c) {
    return func b(p) {
        return c + p
    }
}

const c1 = 5
a(c1)(6) = 11
a(c1)(7) = 12
...

函数的问题是对DOM的副作用。在DOM中进行更改时，其他过程也可以更改相同的元素。这不是功能性方法。阅读更多如何使用更多功能方法来解决DOM上的副作用。

另外，针对您的情况，请使用map而不是foreach。

Answer 2

您正在混淆一些不同的东西：

您想要一个tr元素列表
通过正则表达式匹配其内容进行过滤
隐藏

第三个是有问题的，因为它本质上是无法运行的（技术上第一个也可以，但是我们会假装HTML不能更改）。在功能范式中，您希望将逻辑与执行副作用的代码分开：

// Pull out the filtering logic into a pure (for Javascript) function
const filterElement = regex => elem => elem.innerHTML.match(regex);

// Pull the side-effect out into an impure function
const hide = elem => elem.style.display = 'none';

[ ...document.getElementById('threadbits_forum_2').querySelectorAll('tr') ]
  .filter(filterElement(/word1|word2|word3/gi)) // note the i flag
  .forEach(hide);

我如何使用函数式编程范例来编写此JavaScript函数？

2 个答案: