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高级程序设计(第3版)学习笔记8 js函数(中)
Oct 11 Javascript
JavaScript中逗号运算符介绍及使用示例
Mar 13 Javascript
JavaScript类型检测之typeof 和 instanceof 的缺陷与优化
Jan 13 Javascript
JavaScript基础语法之js表达式
Jun 07 Javascript
json对象与数组以及转换成js对象的简单实现方法
Jun 24 Javascript
javascript 解决浏览器不支持的问题
Sep 24 Javascript
Javascript使用SWFUpload进行多文件上传
Nov 16 Javascript
使用canvas实现一个vue弹幕组件功能
Nov 30 Javascript
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 jQuery
vue element 中的table动态渲染实现(动态表头)
Nov 21 Javascript
ant design vue 表格table 默认勾选几项的操作
Oct 31 Javascript
JavaScript ES6的函数拓展
Jan 18 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
关于Sphinx创建全文检索的索引介绍
2013/06/25 PHP
php不使用插件导出excel的简单方法
2014/03/04 PHP
php使用cookie实现记住登录状态
2015/04/27 PHP
php通过curl模拟登陆DZ论坛
2015/05/11 PHP
Zend Framework实现留言本分页功能(附demo源码下载)
2016/03/22 PHP
Laravel学习教程之从入口到输出过程详解
2017/08/27 PHP
php设计模式之策略模式实例分析【星际争霸游戏案例】
2020/03/26 PHP
Aster vs KG BO3 第一场2.18
2021/03/10 DOTA
漂亮的widgets,支持换肤和后期开发新皮肤
2007/04/23 Javascript
jquery ajaxSubmit 异步提交的简单实现
2014/02/28 Javascript
实现js保留小数点后N位的代码
2014/11/13 Javascript
Node.js node-schedule定时任务隔多少分钟执行一次的方法
2015/02/10 Javascript
JavaScript中Number.MIN_VALUE属性的使用示例
2015/06/04 Javascript
Angular 根据 service 的状态更新 directive
2016/04/03 Javascript
JavaScript_ECMA5数组新特性详解
2016/06/12 Javascript
jquery层级选择器的实现(匹配后代元素div)
2016/09/05 Javascript
微信小程序后台解密用户数据实例详解
2017/06/28 Javascript
Angular.js中angular-ui-router的简单实践
2017/07/18 Javascript
Vue-router 类似Vuex实现组件化开发的示例
2017/09/15 Javascript
解决bootstrap-select 动态加载数据不显示的问题
2018/08/10 Javascript
Vue数据双向绑定的深入探究
2018/11/27 Javascript
JS window对象简单操作完整示例
2020/01/14 Javascript
js实现圆形显示鼠标单击位置
2020/02/11 Javascript
vue通过过滤器实现数据格式化
2020/07/20 Javascript
Vue select 绑定动态变量的实例讲解
2020/10/22 Javascript
js属性对象的hasOwnProperty方法的使用
2021/02/05 Javascript
linux下安装easy_install的方法
2013/02/10 Python
修复CentOS7升级Python到3.6版本后yum不能正确使用的解决方法
2018/01/26 Python
PyTorch上搭建简单神经网络实现回归和分类的示例
2018/04/28 Python
正则给header的冒号两边参数添加单引号(Python请求用)
2019/08/09 Python
在pycharm中使用matplotlib.pyplot 绘图时报错的解决
2020/06/01 Python
英国著名音像制品和图书游戏购物网站:Zavvi
2016/08/04 全球购物
运动会通讯稿500字
2014/02/20 职场文书
2015年乡镇卫生院妇幼保健工作总结
2015/05/19 职场文书
在windows server 2012 r2中安装mysql的详细步骤
2022/07/23 Servers