jquery - 为什么 jQuery 的 $.each 这么快？

Question

我必须将大量 XML 数据解析为对象。我想到了三种方法来将这个 XML 获取到一个对象:

XML

<myXml>
  <tag1 val = "someVal"/>
  <tag2 val = "someVal"/>
  <tag3 val = "someVal"/>
</myXml>

选项 1:使用 .find()

var xml = getMyXml();
var myObj = {
   1 : xml.find('tag1').attr('val'),
   2 : xml.find('tag2').attr('val'),
   3 : xml.find('tag3').attr('val'),
}

选项 2:使用 .each()

var xml = getMyXml();
var myObj = {
   1 : 'tag1',
   2 : 'tag2',
   3 : 'tag3',
}
$.each(myObj, function(i,e){
  myObj[i] = xml.find(e).attr('val');
});

方案三:数组

var xml = getMyXml();
var myArr = ['tag1','tag2','tag3']
var myObj = {};
for(var i = 0; i < myArr.length; i++){
 myObj[i] = xml.find(myArr[i]).attr('val');
}

使用此性能 http://jsperf.com/each-vs-arraysdfsdf 选项 2 比其他两个选项快 82%。为什么？

Answer 1

如果你不混合数组和 jquery，只是简单地使用数组的纯 javascript 函数，那么结果是完全不同的，而且速度太快了。使用 jquery each 时，选择器开销得到了优化，这可能是您的测试用例速度更快的原因。

var len = digitalArr.length; //Cache the length
var i = 0;
for (; i < len ; i++) {
  obj[i] = xmlobj.getElementsByTagName(''+digitalArr[i]+'')[0].getAttribute('val');
}

查看jsperf结果here