JS中数组与对象的遍历方法实例小结


Posted in Javascript onAugust 14, 2018

本文实例讲述了JS中数组与对象的遍历方法。分享给大家供大家参考,具体如下:

一、数组的遍历:

首先定义一个数组

arr=['snow','bran','king','nightking'];

1、for循环,需要知道数组的长度;

2、foreach,没有返回值,可以不知道数组长度;

arr.forEach(function(ele,index){
console.log(index);
console.log(ele)
})

3、map函数,遍历数组每个元素,并回调操作,需要返回值,返回值组成新数组,原数组不变;

var newarr=arr.map(function(i){
  return "hello "+i
});
console.log(newarr)

4、filter函数:过滤通过条件的元素组成一个新数组,原数组不变;

var newarr=arr.filter(function(i){
  return i == "bran"
});
console.log(newarr)

5、some函数,遍历数组中是否有符合条件的函数,返回布尔值;

var yy=arr.some(function(i){
  return i.length>4
});
console.log(yy)       //true

6、every函数,遍历数组是否每个元素都符合条件,返回布尔值;

var xx=arr.every(function(i){
  return i.length>4
});
console.log(xx)       //false

7、reduce函数,为数组中的每一个元素依次执行回调函数

语法:

arr.reduce(callback, initialValue)
[0,1,2,3,4].reduce(function(previousValue, currentValue, index, array){
 return previousValue + currentValue;
});

callback:执行数组中每个值的函数,包括四个参数;

  • previousValue:上一次调用回调返回的值,或者是提供的初始值(initialValue);
  • currentValue:当前被处理的值;
  • index:当前元素在数组中的索引;
  • array:调用reduce的数组;
  • initialValue:作为第一次调用callback的第一个参数;

例如:

var total = [0, 1, 2, 3].reduce(function(a, b) {
  return a + b;
});
// total == 6
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
});
// flattened is [0, 1, 2, 3, 4, 5]

要提供initialValue的话:

var total = [0, 1, 2, 3].reduce(function(a, b) {
   return a + b;
},4);
console.log(total); //10

二、对象的遍历

var obj={snow:1,bran:2,king:3,nightking:4};
for(let i in obj){
  console.log(i+','+obj[i])
}

in也可以用来遍历数组,不过i对应于数组的key值:

for(let i in arr){
  console.log(i+','+arr[i])
}
Javascript 相关文章推荐
从javascript语言本身谈项目实战
Dec 27 Javascript
js的写法基础分析
Jan 17 Javascript
jQuery基础语法实例入门
Dec 23 Javascript
JS onkeypress兼容性写法详解
Apr 27 Javascript
JavaScript遍历求解数独问题的主要思路小结
Jun 12 Javascript
canvas学习之API整理笔记(二)
Dec 29 Javascript
xmlplus组件设计系列之下拉刷新(PullRefresh)(6)
May 03 Javascript
Vue学习笔记进阶篇之单元素过度
Jul 19 Javascript
微信小程序实现轮播图效果
Sep 07 Javascript
详解利用Angular实现多团队模块化SPA开发框架
Nov 27 Javascript
搭建一个Koa后端项目脚手架的方法步骤
May 30 Javascript
React学习之JSX与react事件实例分析
Jan 06 Javascript
layui实现table加载的示例代码
Aug 14 #Javascript
layui点击导航栏刷新tab页的示例代码
Aug 14 #Javascript
JavaScript中toLocaleString()和toString()的区别实例分析
Aug 14 #Javascript
layer插件select选中默认值的方法
Aug 14 #Javascript
解决Layui选择全部,换页checkbox复选框重新勾选的问题方法
Aug 14 #Javascript
js中apply()和call()的区别与用法实例分析
Aug 14 #Javascript
JS通过位运算实现权限加解密
Aug 14 #Javascript
You might like
PHP实现多维数组转字符串和多维数组转一维数组的方法
2015/08/08 PHP
ThinkPHP模板标签eq if 中区分0,null,false的方法
2017/03/24 PHP
PHP实现的ID混淆算法类与用法示例
2018/08/10 PHP
PHP队列场景以及实现代码实例详解
2021/02/26 PHP
jquery下异步提交表单 异步跨域提交表单
2010/11/17 Javascript
javascript面向对象之二 命名空间
2011/02/08 Javascript
javascript 学习笔记(六)浏览器类型及版本信息检测代码
2011/04/08 Javascript
jQuery实现当按下回车键时绑定点击事件
2014/01/28 Javascript
js格式化时间和js格式化时间戳示例
2014/02/10 Javascript
jQuery处理json数据返回数组和输出的方法
2015/03/11 Javascript
JavaScript动态改变表格单元格内容的方法
2015/03/30 Javascript
jQuery事件绑定与解除绑定实现方法
2015/04/15 Javascript
Jquery实现弹性滑块滑动选择数值插件
2015/08/08 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
js友好的时间返回函数
2016/08/24 Javascript
JS获取一个表单字段中多条数据并转化为json格式
2017/10/17 Javascript
微信小程序实现点击文字页面跳转功能【附源码下载】
2017/12/12 Javascript
NodeJs form-data格式传输文件的方法
2017/12/13 NodeJs
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
ES6 Object.assign()的用法及其使用
2020/01/18 Javascript
JavaScript实现简易聊天对话框(加滚动条)
2020/02/10 Javascript
[02:36]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Magma 选手采访
2021/03/11 DOTA
Python 不同对象比较大小示例探讨
2014/08/21 Python
python实现在目录中查找指定文件的方法
2014/11/11 Python
使用Python对Excel进行读写操作
2017/03/30 Python
python实现生成字符串大小写字母和数字的各种组合
2019/01/01 Python
Python 图像对比度增强的几种方法(小结)
2019/09/25 Python
Python TCPServer 多线程多客户端通信的实现
2019/12/31 Python
全球立体声:World Wide Stereo
2018/09/29 全球购物
应届本科生推荐信范文
2013/12/25 职场文书
优秀女职工事迹材料
2014/02/06 职场文书
水污染治理工程专业自荐信
2014/06/21 职场文书
党员剖析材料范文
2014/12/18 职场文书
自荐信格式模板
2015/03/27 职场文书
《黑岩★★射手 DAWN FALL》BD发售宣传CM公开
2022/04/04 日漫
数据设计之权限的实现
2022/08/05 MySQL