有人可以解释为什么此测试显示jquery $ .each比本地速度快吗？

Question

我正在Chrome的浏览器控制台中运行以下测试。 我想看看原生的速度快了多少，才发现结果显示jquery $ each更快？ 我知道这不是真的，但如果可能的话，我想解释一下。

var array = new Array();
for (var i = 0; i < 10000; i++) {
    array[i] = 0;
}

console.time('native');
var l = array.length;
for (var i = 0; i < l; i++) {
    array[i] = i;
}
console.timeEnd('native');

console.time('jquery');
$.each(array, function(i) {
    array[i] = i;
});
console.timeEnd('jquery');

native: 26.160ms
jquery: 5.665ms

如果我将相同的代码放在setTimeout（）中，则结果如下所示：

native: 0.123ms
jquery: 0.885ms

Answer 1

这可能是由于Chrome编译功能，而不是在功能之外编译控制台输入。 编译的函数运行速度快得多。 jQuery.each已被编译（在页面上包含jQuery时）。

将您的第一个测试包装在立即调用的函数（Chrome可以在执行之前对其进行编译）的内部，您会看到非常相似的结果：

console.time('native');
(function(){
    var l = array.length;
    for (var i = 0; i < l; i++) {
        array[i] = i;
    }
})();
console.timeEnd('native');

console.time('jquery');
// ... unchanged
console.timeEnd('jquery');

native: 3.518ms
jquery: 3.308ms

这就是为什么你当你把代码在函数内部被彻底看到差异导致setTimeout喜欢setTimeout(function() { ... }, 1) 该函数内部的代码已编译并运行得更快。