JavaScript中循环遍历Array与Map的方法小结


Posted in Javascript onMarch 12, 2016

js循环数组各种方法
eg1:

for (var i = 0; i < myStringArray.length; i++) { 
 alert(myStringArray[i]); 
 //Do something 
}

eg2:

Array.prototype.foo = "foo!"; 
var array = ['a', 'b', 'c']; 
 
for (var i in array) { 
 alert(array[i]); 
} 
 
for(var i in this.$GLOBAL_DETAIL.album_photo_ids){if(this.$GLOBAL_DETAIL.album_photo_ids[i] == "3487675024077108") alert(this.$GLOBAL_DETAIL.album_photo_ids[i]);}

eg3:

[1,2,3,4].map( function(item) { 
   alert(item); 
})

eg4:

var x = [1,2,3,4].map( function(item) { return item * 10; } ); 
 
// And now x is [10,20,30,40]

eg5:

var myStringArray = [ "Hello", "World" ] 
var len = myStringArray.length 
for (var i=0; i<len; ++i) { 
 if (i in myStringArray) { 
 var s = myStringArray[i]; 
 ... do something with s ... 
 } 
}

eg6:

var myStringArray = [ "Hello", "World" ] 
myStringArray.forEach( function(s) { 
  ... do something with s ... 
} )

eg7:

var i=0,item,items = ['one','two','three']; 
while(item=items[i++]){ 
 console.log(item); 
} 
 
// logs: 'one','two','three' 
 
and for the reverse order, an even more efficient loop 
var items = ['one','two','three'], i=items.length; 
while(i--){ 
 console.log(items[i]); 
} 
 
// logs: 'three','two','one' 
 
or the classical for loop 
var items = ['one','two','three'] 
for(var i=0,l=items.length; i < l ; i++){ 
 console.log(items[i]); 
} 
 
// logs: 'one','two','three'

eg8:

var myStringArray = ['Hello', 'World']; // array uses [] not {} 
for (var i in myStringArray) { 
 console.log(i + ' -> ' + myStringArray[i]); // i is the index/key, not the item 
}

js循环map,获取所有的key和value
eg1:

//Page地址 
 pageUrl : { 
  menu   : "loadPage.htm?url=/collect/menu.page",   // 进入菜单页面 
  guangfaPage  : "loadPage.htm?url=/collect/menu.page",   // 进入广发信息收集页面 
  pinganPage  : "loadPage.htm?url=/collect/menu.page",   // 进入平安信息收集页面 
  nuonuoPage  : "loadPage.htm?url=/collect/menu.page",   // 进入诺诺信息收集页面 
  youbangPage  : "loadPage.htm?url=/collect/menu.page",   // 进入友邦信息收集页面 
  inputMobileNo : "loadPage.htm?url=/collect/inputMobileNo.page", // 进入输入手机号页面 
  readIdCard  : "loadPage.htm?url=/collect/readIdCard.page",  // 进入读取身份证页面 
  member   : "loadPage.htm?url=/collect/member.page",   // 进入输入会员卡号页面 
  bankCard  : "loadPage.htm?url=/collect/bankCard.page",   // 进入插入银行卡页面 
  url   : "loadPage.htm?url=/collect/url.page"    // 进入跳转url页面 
 }, 
 
for(var key in this.pageUrl){ 
 alert(key+" : "+this.pageUrl[key]); 
}

eg2:

var obj = { 
 "a": 1, 
 "b": 2, 
 "c": 3 
}; 
 
for (var prop in obj) { 
 if (obj.hasOwnProperty(prop)) { 
 // or if (Object.prototype.hasOwnProperty.call(obj,prop)) for safety... 
 alert("prop: " + prop + " value: " + obj[prop]) 
 } 
}

双重Map循环
eg:

var msg = ""; 
for(var key in Pin) { 
 for(var i in Pin[key]){ 
 msg+=i+": "+Pin[key][i]+"\n"; 
 } 
} 
alert(msg);
Javascript 相关文章推荐
js中将HTMLCollection/NodeList/伪数组转换成数组的代码
Jul 31 Javascript
原生js实现shift/ctrl/alt按键的获取
Apr 08 Javascript
jQuery动画出现连续触发、滞后反复执行的解决方法
Jan 28 Javascript
提交按钮的name='submit'引起的js失效问题及原因
Feb 25 Javascript
javascript实现在指定元素中垂直水平居中
Sep 13 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
May 10 Javascript
详细解读Jquery各Ajax函数($.get(),$.post(),$.ajax(),$.getJSON())
Aug 15 Javascript
jQuery的Cookie封装,与PHP交互的简单实现
Oct 05 Javascript
完美实现js拖拽效果 return false用法详解
Jul 28 Javascript
elemetUi 组件--el-upload实现上传Excel文件的实例
Oct 27 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
Jul 10 Javascript
JS中数据结构与算法---排序算法(Sort Algorithm)实例详解
Jun 17 Javascript
Node.js的Express框架使用上手指南
Mar 12 #Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
Mar 11 #Javascript
JavaScript操作HTML DOM节点的基础教程
Mar 11 #Javascript
举例说明JavaScript中的实例对象与原型对象
Mar 11 #Javascript
JavaScript中setTimeout和setInterval函数的传参及调用
Mar 11 #Javascript
原生JavaScript制作微博发布面板效果
Mar 11 #Javascript
JavaScript获取图片像素颜色并转换为box-shadow显示
Mar 11 #Javascript
You might like
php5 mysql分页实例代码
2008/04/10 PHP
php设计模式 Visitor 访问者模式
2011/06/28 PHP
php中switch语句用法详解
2015/08/17 PHP
php中__toString()方法用法示例
2016/12/07 PHP
php生成毫秒时间戳的实例讲解
2017/09/22 PHP
thinkPHP中钩子的使用方法实例分析
2017/11/16 PHP
js如何调用qq互联api实现第三方登录
2014/03/28 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
浅析使用BootStrap TreeView插件实现灵活配置快递模板
2016/11/28 Javascript
Jquery把获取到的input值转换成json
2017/05/15 jQuery
浅谈事件冒泡、事件委托、jQuery元素节点操作、滚轮事件与函数节流
2017/07/22 jQuery
angular 组件通信的几种实现方式
2018/07/13 Javascript
微信小程序列表中item左滑删除功能
2018/11/07 Javascript
vue router导航守卫(router.beforeEach())的使用详解
2019/04/19 Javascript
JavaScript变量作用域及内存问题实例分析
2019/06/10 Javascript
js实现旋转木马轮播图效果
2020/01/10 Javascript
微信小程序多列表渲染数据开关互不影响的实现
2020/06/05 Javascript
解决Antd Table组件表头不对齐的问题
2020/10/27 Javascript
Python学习之asyncore模块用法实例教程
2014/09/29 Python
Python队列的定义与使用方法示例
2017/06/24 Python
python+selenium实现京东自动登录及秒杀功能
2017/11/18 Python
Python基于socket实现简单的即时通讯功能示例
2018/01/16 Python
mvc框架打造笔记之wsgi协议的优缺点以及接口实现
2018/08/01 Python
Python3爬虫教程之利用Python实现发送天气预报邮件
2018/12/16 Python
django模板加载静态文件的方法步骤
2019/03/01 Python
python-django中的APPEND_SLASH实现方法
2019/06/21 Python
详解将Python程序(.py)转换为Windows可执行文件(.exe)
2019/07/19 Python
python基于celery实现异步任务周期任务定时任务
2019/12/30 Python
css3实现背景颜色渐变让图片不再是唯一的实现方式
2012/12/18 HTML / CSS
CSS3 画基本图形,圆形、椭圆形、三角形等
2016/09/20 HTML / CSS
HTML5拖放API实现拖放排序的实例代码
2017/05/11 HTML / CSS
canvas实现滑动验证的实现示例
2020/08/11 HTML / CSS
The Athlete’s Foot新西兰:新西兰最大的运动鞋零售商
2019/12/23 全球购物
法律系毕业生求职信
2014/05/28 职场文书
暑期教师培训方案
2014/06/07 职场文书
地道战观后感300字
2015/06/04 职场文书