javascript - 为什么在 JQuery/JavaScript 中使用扩展？

Question

在下面的 JQuery UI 小部件中，作者使用扩展在 $.ui.autocomplete 中包含了另外两个函数，为什么？这是 JQuery 特定的模式还是我可以在普通 JS 中考虑的东西？

$.extend( $.ui.autocomplete, {
escapeRegex: function( value ) {
    return value.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
},
filter: function(array, term) {
    var matcher = new RegExp( $.ui.autocomplete.escapeRegex(term), "i" );
    return $.grep( array, function(value) {
        return matcher.test( value.label || value.value || value );
    });
}
});

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.autocomplete.js#L385

Answer 1

没有理由使用它，实际上它会比手动常规 JS 方式慢。 jQuery 开发人员经常遇到的问题是他们只知道如何使用 jQuery 而不知道常规的 javascript。 jQuery 的扩展函数是一个递归函数，与您自己管理事物相比实际上非常慢。

*edit * 由于人们似乎不想接受这个答案，让我来说明为什么没有理由。

如果您在这里查看 github 上的 jQuery 代码:https://github.com/jquery/jquery/blob/master/src/core.js你会在第 313 行找到 jQuery.extend 的定义。

首先，让我们看看做非jQuery扩展方式需要什么。

$.ui.autocomplete.escapeRegex = function() {}
$.ui.autocomplete.filter = function() {}

两个定义，没有函数调用。非常简单和快速的代码。

如果您使用扩展，这就是 jQuery 所做的。

在第 315 行，我们看到了一个快速的小测试来稍微组织一下参数。 接下来我们有另一个可能执行代码的小 IF 语句。 接下来是另一个 IF，在 if 内部有一个函数调用。 接下来是另一个 IF。 然后我们为每个参数输入一个 FOR 循环，在我们的例子中是两轮。 在每次通过时，首先检查空值，这在我们的情况下是不必要的，因为我们自己创建了函数。 现在我们有了一个 FOR IN 循环，它本质上非常慢，因为必须查找对象映射中的每个项目，而不是仅仅遍历迭代器。 现在我们终于将我们的一个函数复制到 jQuery 中了! 做另一项检查以确保我们不会进入无限循环...... 这次对于我们的案例，我们只再做一个小的 IF 检查。 循环重复直到事情完成。

因此，此方法比直接复制到 jQuery 对象本身慢远。使用 API 的人的一个常见问题是，即使函数使用可能很简单并且看起来又快又容易，但与自己动手相比，内部结构可能非常复杂和缓慢。