遍历
想到的有for in循环;for循环;forEach循环
(1)for in
性能问题:
for-in 需要分析出array 的每个属性,这个操作性能开销很大。用在 key 已知的数组上是非常不划算的。所以尽量不要用 for-in,除非你不清楚要处理哪些属性,例如 JSON 对象这样的情况。
(2)for
性能问题:循环每进行一次,就要检查一下数组长度。读取属性(数组长度)要比读局部变量慢,尤其是当 array 里存放的都是 DOM 元素,因为每次读取都会扫描一遍页面上的选择器相关元素,速度会大大降低。
for (var i=0; i<arr.length; i++){ //do sth with arr[i]; }
加速方案:
var arr = [1,2,3,4,5]; var length =arr.length; for(var i=0; i<length; i++){ fn(arr[i]); }
思路:
现在只需要读取一次 array 的 length 属性,速度已经加快
加速且优雅:
var arr = [1,2,3,4,5]; var i = arr.length; while(i--){ fn(arr[i]); }
思路:如果循环终止条件不进行比较运算,那么循环的速度还可以更快。
(3)forEach
var arr = [1,2,3,4,5];
arr.forEach(
fn(value,index){
//Do sth with value ;
}
)
注意:
- 这里的 forEach回调中两个参数分别为 value,index,其位置刚好和 jQuery 的$.each 相反;
- forEach 无法遍历对象;
- IE不支持该方法;Firefox 和 chrome 支持;
- forEach 无法使用 break,continue 跳出循环,且使用 return 是跳过本次循环;
- 可以添加第二个参数,为一个数组,回调中的 this 会指向这个数组,若没有添加,则是指向 window;
只有在泥泞的道路上才能留下脚印