针对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. win7系统中使用DOS命令是出现乱码的解决方法

    方法一:设置cmd显示字体1.win+R打开运行窗口->输入cmd->回车,打开命令行提示符窗口 win7系统运行窗口win7系统DOS命令行提示窗口 2.在命令行标题栏上点击右键,选择” ...

  2. Cmake新手使用日记(1)【C++11下的初体验】

    第一次使用Cmake,搜索了很多使用教程,包括<Cmake实践>.<Cmake手册>等,但是在针对最新的C++11条件下编程还是会存在一点点问题,需要实验很多次错误并搜索大量文 ...

  3. 10.application对象

    1.application对象实现了用户数据的共享,可存放全局变量 2.application开始于服务器的启动,终止于服务器的关闭. 3.在用户的前后连接或不同用户之间的连接中,可以对applica ...

  4. AngularJS服务和路由

    colnplie     网页加载的出现一次 link     元素每次改变的时候 **$watch** 监听列表     $scope.$watch("name",functio ...

  5. 开源 .net license tool, EasyLicense !

    介绍: 过去我常常像是否有一个帮助授权的软件,它可以非常简单的创建license,并且非常容易的验证license. 这是一个非常普通和公共的功能,但是我没有找到合适的开源软件,大部分开源软件都比较复 ...

  6. AngularJS4.0环境搭建详解--windows系统环境

    第一步:安装NodeJS 下载最新版的NodeJS并安装,安装完成后打开CMD命令行,输入以下命令: node -v 若返回类似版本号则代表NodeJS安装成功,如下: 第二部 安装npm 新版的No ...

  7. python2和python3中的类

    经典类与新式类 例如: A B C D 四个类 D 包含 BC :   B和C分别包含A py2 在经典类中是按深度优先来继承 例如: D中查找B,B没有从A中查找 新式类中是按广度优先来查找继承的 ...

  8. (转载)IQ 16.0 SP02起支持从压缩文件直接装载数据到表中

    参考文档: http://m.blog.chinaunix.net/uid-16765068-id-4405877.htmlhttp://www.cnblogs.com/lichmama/p/4103 ...

  9. Chrome浏览器扩展开发系列之三:Google Chrome浏览器扩展的架构

    1) 不可视的background页面 Google Chrome扩展往往包含一个不可见的background页面,Google Chrome扩展的主要业务逻辑都位于此.有两种类型的backgroun ...

  10. (Android)Wifi-Direct直连

    因项目需要Pad端和手机端交互,采用wifi直连.查阅资料,大概写下一些资料和收获吧.注:大公司的代码带不出来,我也比较懒不想再认真去写一遍了,所以大概这个意思哦. wifi直连也叫做wifi设备点对 ...