针对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. 《javascript高级程序设计》笔记三

    第三章 基本概念 任何语言的核心必然会描述这门语言最基本的工作原理.这部分内容对我们来说,读起来很乏味,甚至会产生困意,但这部分内容却是重要的!我有幸拜读<JavaScript高级程序设计> ...

  2. PHP运行出现Notice : Use of undefined constant

    这些是 PHP 的提示而非报错,PHP 本身不需要事先声明变量即可直接使用,但是对未声明变量会有提示.一般作为正式的网站会把提示关掉的,甚至连错误信息也被关掉 关闭 PHP 提示的方法 搜索php.i ...

  3. mysql 左连接 右连接 内链接

    一般所说的左连接,右连接是指左外连接,右外连接.做个简单的测试你看吧.先说左外连接和右外连接:[TEST1@orcl#16-12月-11] SQL>select * from t1;ID NAM ...

  4. Example003通过按钮创建窗口

    <!--实例003通过按钮创建窗口--> <head> <meta charset="UTF-8"> </head> <for ...

  5. String,StringBuffer与StringBuilder

    1. String,StringBuffer与StringBuilder的区别 String:存储在常量池中:是不可变的字符序列,任何对String值的改变都会引发新的String对象的生成,因此执行 ...

  6. ExtJs异步无法向外传值和赋值的解决办法,亲测有效

    1.Ext.data.Store.load();方法是异步的,下面的方式获得的reCount始终是0,因为还没等后台的方法执行完就赋值了,此时store的record还没获得值. var testSt ...

  7. JS实现为控件添加倒计时功能

    一.概述 在有些报表需求中,需要为控件添加倒计时功能,限制到某一个时间点后能进行一项操作或不能进行某项操作,比如查询,导出功能等等,又需要人性化地显示还有多少时间,即倒计时功能,比如下图中我们限制这个 ...

  8. (转)基于 Token 的身份验证

    原文:https://ninghao.net/blog/2834 最近了解下基于 Token 的身份验证,跟大伙分享下.很多大型网站也都在用,比如 Facebook,Twitter,Google+,G ...

  9. 使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)

    上文<使用 VS2017 和 js 进行桌面程序开发 - electron 之 Hello Word>介绍了如何使用 VS2017 开发 electron 桌面程序,今天来点有看头的,但是 ...

  10. Unreal Engine 4(虚幻UE4)GameplayAbilities 插件入门教程(七)Ability的信息传递等

    本节及后面的内容将会探索更加有意思的内容,更加逼近实际的使用的内容.我们本节内容不难,讲的是释放Ability时的信息传递: 第一步:创建一个GA称为GA_AOE_BlindVengeance,复仇忌 ...