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 相关文章推荐
JavaScript的eval JSON object问题
Nov 15 Javascript
js自动查找select下拉的菜单并选择(示例代码)
Feb 26 Javascript
jQuery实现的漂亮表单效果代码
Aug 18 Javascript
浅析jQuery Mobile的初始化事件
Dec 03 Javascript
理解Javascript图片预加载
Feb 23 Javascript
Bootstrap框架实现广告轮播效果
Nov 28 Javascript
ES6的Fetch异步请求的实现方法
Dec 07 Javascript
详解vuejs2.0 select 动态绑定下拉框支持多选
Apr 25 Javascript
Vue路由之JWT身份认证的实现方法
Aug 26 Javascript
ElementUI多个子组件表单的校验管理实现
Nov 07 Javascript
Vue中watch、computed、updated三者的区别及用法
Jul 27 Javascript
基于elementUI竖向表格、和并列的案例
Oct 26 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
php开发工具之vs2005图解
2008/01/12 PHP
浅析php原型模式
2014/11/25 PHP
ThinkPHP3.2.3框架实现执行原生SQL语句的方法示例
2019/04/03 PHP
网上抓的一个特效
2007/05/11 Javascript
jQuery中$.fn的用法示例介绍
2013/11/05 Javascript
jquery下div 的resize事件示例代码
2014/03/09 Javascript
javascript实现字符串反转的方法
2015/02/05 Javascript
js通过iframe加载外部网页的实现代码
2015/04/05 Javascript
JavaScript保留关键字汇总
2015/12/01 Javascript
dedecms页面如何获取会员状态的实例代码
2016/03/15 Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
2016/03/29 Javascript
全面解析Bootstrap中Carousel轮播的使用方法
2016/06/13 Javascript
javascript表单控件实例讲解
2016/09/13 Javascript
手机端js和html5刮刮卡效果
2020/09/29 Javascript
React中使用collections时key的重要性详解
2017/08/07 Javascript
微信小程序使用request网络请求操作实例
2017/12/15 Javascript
VUE+Element UI实现简单的表格行内编辑效果的示例的代码
2018/10/31 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
2019/04/15 Javascript
vue form表单post请求结合Servlet实现文件上传功能
2021/01/22 Vue.js
[08:07]DOTA2每周TOP10 精彩击杀集锦vol.8
2014/06/25 DOTA
[53:49]LGD vs Fnatic 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[49:21]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第二场 11.05
2020/11/06 DOTA
Python实现的视频播放器功能完整示例
2018/02/01 Python
利用Python的turtle库绘制玫瑰教程
2019/11/23 Python
Python中操作各种多媒体,视频、音频到图片的代码详解
2020/06/04 Python
python中slice参数过长的处理方法及实例
2020/12/15 Python
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
数学与统计学院学生个人职业生涯规划书
2014/02/10 职场文书
节能标语大全
2014/06/21 职场文书
六查六看六改心得体会
2014/10/14 职场文书
介绍长城的导游词
2015/01/30 职场文书
工作简报怎么写
2015/07/21 职场文书
关爱空巢老人感想
2015/08/11 职场文书
2015年幼儿园班主任个人工作总结
2015/10/22 职场文书
详解Java ES多节点任务的高效分发与收集实现
2021/06/30 Java/Android
MySQL query_cache_type 参数与使用详解
2021/07/01 MySQL