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的表单操作 简单计算器
Dec 29 Javascript
JavaScript调用堆栈及setTimeout使用方法深入剖析
Feb 16 Javascript
js中split函数的使用方法说明
Dec 26 Javascript
js中array的sort()方法使用介绍
Feb 20 Javascript
HTML5游戏引擎LTweenLite实现的超帅动画效果(附demo源码下载)
Jan 26 Javascript
js停止冒泡和阻止浏览器默认行为的简单方法
May 15 Javascript
解读Bootstrap v4 sass设计
May 29 Javascript
javascript添加前置0(补零)的几种方法
Jan 05 Javascript
jQuery中table数据的值拷贝和拆分
Mar 19 Javascript
AngularJS自定义指令详解(有分页插件代码)
Jun 12 Javascript
JavaScript时间与时间戳的转换操作实例分析
Dec 07 Javascript
深入浅析ng-bootstrap 组件集中 tabset 组件的实现分析
Jul 19 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与MySQL开发中页面乱码的产生与解决
2008/03/27 PHP
php面向对象全攻略 (十) final static const关键字的使用
2009/09/30 PHP
解析phpstorm + xdebug 远程断点调试
2013/06/20 PHP
YII实现分页的方法
2014/07/09 PHP
LNMP部署laravel以及xhprof安装使用教程
2017/09/14 PHP
新发现一个骗链接的方法(js读取cookies)
2012/01/11 Javascript
基于jquery实现状态限定编辑的代码
2012/02/11 Javascript
基于JavaScript实现表单密码的隐藏和显示出来
2016/03/02 Javascript
React学习笔记之事件处理(二)
2017/07/02 Javascript
原生js调用json方法总结
2018/02/22 Javascript
AngularJS使用$http配置对象方式与服务端交互方法
2018/08/13 Javascript
Vant的安装和配合引入Vue.js项目里的方法步骤
2018/12/05 Javascript
vue如何实现自定义底部菜单栏
2019/07/01 Javascript
vue data变量相互赋值后被实时同步的解决步骤
2020/08/05 Javascript
jQuery实现移动端扭蛋机抽奖
2020/11/08 jQuery
Python3使用requests发闪存的方法
2016/05/11 Python
Python3.x对JSON的一些操作示例
2017/09/01 Python
Python中%是什么意思?python中百分号如何使用?
2018/03/20 Python
解决python "No module named pip" 的问题
2018/10/13 Python
如何利用Boost.Python实现Python C/C++混合编程详解
2018/11/08 Python
python xlwt如何设置单元格的自定义背景颜色
2019/09/03 Python
使用python实现飞机大战游戏
2020/03/23 Python
css3实现3d旋转动画特效
2015/03/10 HTML / CSS
使用HTML5的File实现base64和图片的互转
2013/08/01 HTML / CSS
英国手工制作的现代与经典的沙发和床:Love Your Home
2020/09/26 全球购物
历史教育专业个人求职信
2013/12/13 职场文书
初三家长会邀请函
2014/01/18 职场文书
小学数学国培感言
2014/03/10 职场文书
跳蚤市场口号
2014/06/13 职场文书
七一讲话心得体会
2014/09/05 职场文书
庆祝三八妇女节标语
2014/10/09 职场文书
2016寒假假期总结
2015/10/10 职场文书
《黄山奇石》教学反思
2016/02/18 职场文书
大学生,三分钟即兴演讲稿
2019/07/22 职场文书
SpringCloud之@FeignClient()注解的使用方式
2021/09/25 Java/Android
golang的文件创建及读写操作
2022/04/14 Golang