针对js各种遍历作一个总结分析,从类型用处:分数组遍历和对象遍历;还有性能,优缺点等。

JS数组遍历:

1,普通for循环,经常用的数组遍历

var arr = [1,2,0,3,9];
for ( var i = 0; i <arr.length; i++){
console.log(arr[i]);
}

2,优化版for循环:使用变量,将长度缓存起来,避免重复获取长度,数组很大时优化效果明显

for(var j = 0,len = arr.length; j < len; j++){
console.log(arr[j]);
}

3,forEach,ES5推出的,数组自带的循环,主要功能是遍历数组,实际性能比for还弱

arr.forEach(function(value,i){
  console.log('forEach遍历:'+i+'--'+value);

})

forEach这种方法也有一个小缺陷:你不能使用break语句中断循环,也不能使用return语句返回到外层函数。

4,map遍历,map即是 “映射”的意思 用法与 forEach 相似

arr.map(function(value,index){
console.log('map遍历:'+index+'--'+value);
});

map遍历支持使用return语句,支持return返回值

var temp=arr.map(function(val,index){
console.log(val);
return val*val
})
console.log(temp);

forEach、map都是ECMA5新增数组的方法,所以ie9以下的浏览器还不支持

5,for-of遍历 是ES6新增功能

for( let i of arr){
console.log(i);
}
  • for-of这个方法避开了for-in循环的所有缺陷
  • 与forEach()不同的是,它可以正确响应break、continue和return语句

for-of循环不仅支持数组,还支持大多数类数组对象,例如DOM NodeList对象

for-of循环也支持字符串遍历

JS对象遍历:

1,for-in遍历

for-in是为遍历对象而设计的,不适用于遍历数组。

遍历数组的缺点:数组的下标index值是数字,for-in遍历的index值"0","1","2"等是字符串

for (var index in arr){
console.log(arr[index]);
console.log(index);
}

js数组遍历和对象遍历的更多相关文章

  1. js数组遍历和对象遍历小结

    数组的遍历 for循环 for(var j = 0,len = arr.length; j < len; j++){ console.log(arr[j]); } forEach,性能比for还 ...

  2. JS——数组中push对象,覆盖问题,每次都创建一个新的对象

    今天写运动框架时,发现将对象push进数组,后面的值会覆盖前面的值,最后输出的都是最后一次的值.其实这一切都是引用数据类型惹的祸.       如果你也有类似问题,可以继续看下去哦.       下面 ...

  3. js数组合并以及对象的遍历

    这是很基础的知识,but,对于一只未系统学习过js,只略懂搬砖的跨界狗,还是经常犯错: 场景:移动端上拉加载更多. 初始数组合并后来请求的数组. 使用concat方法,不过要主要: 使用concat, ...

  4. 小姐姐手把手教你JS数组中的对象去重

    有时候数据库中的数据重复的,我们另一个需求需要数据的唯一性 那么这时候就用到这个方法了  我还是以截图的方式发粗来  不然太丑了 见谅 console.log(map)打印出来的结果已经帮我们把需要的 ...

  5. js数组转成对象

    $scope.addalerts = []; $scope.addalertsString = JSON.stringify($scope.addalerts); 全部教程http://each.si ...

  6. js数组中去重对象

    var allCourses = new Array();var coursesId = new Array();function findCourses() { Courses.data().eac ...

  7. js遍历json对象

    原生js遍历json对象 遍历json对象: 无规律: <script> var json = [ {dd:'SB',AA:'东东',re1:123}, {cccc:'dd',lk:'1q ...

  8. JS数组与对象的遍历方法大全

    本文简单解析各种数组和对象属性的遍历方法: 原生for循环.for-in及forEach ES6 for-of方法遍历类数组集合 Object.key()返回键名的集合 jQuery的$.each() ...

  9. JS数组&对象遍历

    遍历的总结,经常用到的,希望帮助你我成长. JS数组遍历: 1,普通for循环 var arr = [1,2,3,4,9]; for ( var i = 0; i <arr.length; i+ ...

随机推荐

  1. zend studio里面这块注释是用什么快捷键按出来的?

    写完类或函数(注意必须写完,不然出现的信息会不完整)后,在其上方空行输入/**,然后回车 /** * * @param string $a * @param string $b * @param st ...

  2. Selenium chrome配置代理Python版

    环境: windows 7 + Python 3.5.2 + Selenium 3.4.2 + Chrome Driver 2.29 + Chrome 58.0.3029.110 (64-bit) S ...

  3. 【LeetCode】136. Single Number

    题目: Given an array of integers, every element appears twice except for one. Find that single one. No ...

  4. 预编译语句(Prepared Statements)介绍,以MySQL为例

    背景 本文重点讲述MySQL中的预编译语句并从MySQL的Connector/J源码出发讲述其在Java语言中相关使用. 注意:文中的描述与结论基于MySQL 5.7.16以及Connect/J 5. ...

  5. VB6之借助zlib实现gzip解压缩

    这是个简版的,可以拿来做下网页gzip的解压缩,整好我的webserver还不支持这个,有时间了就加上. zlib.dll下载请点击我! 模块zlib.bas的代码如下: 'code by lichm ...

  6. usaco training 4.2.2 The Perfect Stall 最佳牛栏 题解

    The Perfect Stall题解 Hal Burch Farmer John completed his new barn just last week, complete with all t ...

  7. 详细解析 JavaScript 获取元素的坐标

    引言 最近突然看到了有关图片懒加载的问题,大致意思就是初始状态下页面只加载浏览器可视区域的图片,剩余图片在当浏览器可视区域滚动到其位置时才开始加载.貌似现在许多大型网站都有实现懒加载,所以我便就此问题 ...

  8. java多线程系列(一)

    java多线程技能 前言:本系列将从零开始讲解java多线程相关的技术,内容参考于<java多线程核心技术>与<java并发编程实战>等相关资料,希望站在巨人的肩膀上,再通过我 ...

  9. Java IO在实际开发中的应用

    IO是java绕不过去的槛,在开发中io无处不在, 正如同 世界上本没有路,java io写多了,也就知道了大体是什么意思,在读完thinking in java 感觉就更清晰了,结合具体的业务场景, ...

  10. 关于Calendar中设置月份比实际小1的问题

    有如下程序,转化两个字符串数字为date类型,并判断是历史上的星期几,是否同为星期一 代码如下: public static void main(String[] args) throws Parse ...