慢JavaScript函数,我如何改进它?

慢JavaScript函数,我如何改进它?,javascript,Javascript,我有下面的JavaScript函数,它的执行速度似乎非常慢 此函数在循环中被多次调用 function _matches(el, selectors) { var result = selectors.filter(function (selector) { return [].indexOf.call(document.querySelectorAll(selector), el) !== -1; }); return result.length

我有下面的JavaScript函数,它的执行速度似乎非常慢

此函数在循环中被多次调用

function _matches(el, selectors) {

    var result = selectors.filter(function (selector) {
          return [].indexOf.call(document.querySelectorAll(selector), el) !== -1;
    });

    return result.length > 0;
}
下面是如何调用此函数的示例

// Vertical Loop
rows.map(function (element, row) {

    if (_matches(element, '.ignore')) {
        // do something A
    }

    if (_matches(element, '.empty')) {
        // do something B
    }

    var cols = element.querySelectorAll("th, td");
    // Horizontal Loop
    return cols.map(function (element, ic) {

        if (_matches(element, '.ignore')) {
            // do something A
        }
        if (_matches(element, '.empty')) {
            // do something B
        }
    });
});

我不确定[].indexOf.calldocument.querySelectorAllselector,el line的作用或含义,因此我不确定如何提高此函数的性能。

您在DOM中找到与给定选择器匹配的所有元素,然后询问该集合中是否出现了您已经拥有的元素。这是一种非常低效的方法来判断您已经拥有的元素是否与给定的选择器匹配

只需使用element.matchesselector


学习[].indexOf.calldocument.querySelectorAllselector,el所做的是改进函数的最佳第一步。您是否尝试过将其分解为各个组成部分,并查看每个部分的功能?selectors.filter的循环比它需要的多,selectors.some会更有意义。有关详细信息,请参阅。示例中的_matches函数复制了现有的语言功能,但效果很差。如果您是一个可怜的程序员,必须支持Internet Explorer,即使假定Internet Explorer已经死亡,@HereticMonkey假设是这样的话,MDN文章包含一个polyfill,它的效率并不比现有的_matchesop提供的效率高。然而,polyfill只与IE用户相关,其他人都会获得本机元素。匹配。好吧……你在IE上运气不好是的,我更仔细地阅读了caniuse,显然它可以作为MSMatch返回到IE9。我现在被困在一个必须支持IE11的项目上,所以它离我家很近。我只是想警告那些坚持支持它的可怜的笨蛋们:。
// No:
if (_matches(element, '.ignore')) {
  // do something A
}

// Yes:
if (element.matches('.ignore')) {
  // do something A
}