javaScript进阶昂贵的集合

var alldivs = document.getElementsByTagName('div');
  for (var i = 0; i < alldivs.length; i++) {
      document.body.appendChild(document.createElement('div'));

}

/*函数是一个死循环，每次迭代都执行查询操作*/

/*集合拷贝到数组，循环数据比循环集合效率高*/

function toArray(coll) {
  for (var i = 0, a = [], len = coll.length; i < len; i++) {
    a[i] = coll[i];

  }
  return a;
}

　　

var coll = document.getElementsByTagName('div');
var len = coll.length;
var arr = toArray(coll);

function loopCollection() {
  for (var count = 0; count < coll.length; count++) {
/*代码处理*/
  }
  }

  function loopCollection(coll) {
    for (var count = 0; count < arr.length; count++) {
    /*代码处理*/

  }
}

　　

/*读取元素集合的length属性会引发集合进行更新，优化方法很简单，将集合长度缓存为局部变量*/

function loopCollection() {
  var alldivs = document.getElementsByTagName('div');
  var len = coll.length;
  for (var count = 0; count < coll.length; count++) {
    /*代码处理*/
  }
}
/*

1 当同一个Dom的属性和方法需要多次访问时，最好用一个局部变量缓存此成员
2 遍历一个集合时，首要的优化原则是把集合混存在局部变量中，并把length缓存在集合外部
总结*/