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_03_javascript全局观
Oct 11 Javascript
获取服务器传来的数据 用JS去空格的正则表达式
Mar 26 Javascript
jquery中的ajax方法怎样通过JSONP进行远程调用
May 04 Javascript
JQuery核心函数是什么及使用方法介绍
May 03 Javascript
jQuery对象的链式操作用法分析
May 10 Javascript
js实现截图保存图片功能的代码示例
Feb 16 Javascript
Ajax实现不刷新取最新商品
Mar 01 Javascript
微信小程序自定义组件
Aug 16 Javascript
JavaScript怎样在删除前添加确认弹出框?
May 27 Javascript
layui动态绑定事件的方法
Sep 20 Javascript
element中的$confirm的使用
Apr 26 Javascript
原生JS实现拖拽功能
Dec 16 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运行出现Call to undefined function curl_init()的解决方法
2010/11/02 PHP
PHP读取文件内容的五种方式
2015/12/28 PHP
PHPExcel中文帮助手册|PHPExcel使用方法(分享)
2017/06/09 PHP
PHP中关于php.ini参数优化详解
2020/02/28 PHP
JavaScript中的稀疏数组与密集数组[译]
2012/09/17 Javascript
jquery获取tr并更改tr内容示例代码
2014/02/13 Javascript
60个很实用的jQuery代码开发技巧收集
2014/12/15 Javascript
JavaScript实现三阶幻方算法谜题解答
2014/12/29 Javascript
javascript 闭包详解
2015/02/15 Javascript
Javascript中typeof 用法小结
2015/05/12 Javascript
JQuery实现带排序功能的权限选择实例
2015/05/18 Javascript
AngularJs IE Compatibility 兼容老版本IE
2016/09/01 Javascript
jQuery模拟实现的select点击选择效果【附demo源码下载】
2016/11/09 Javascript
JS打开摄像头并截图上传示例
2017/02/18 Javascript
微信小程序支付及退款流程详解
2017/11/30 Javascript
vue判断input输入内容全是空格的方法
2018/03/02 Javascript
[01:12:08]LGD vs OG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.24
2019/09/10 DOTA
Python实现类的创建与使用方法示例
2017/07/25 Python
python中实现延时回调普通函数示例代码
2017/09/08 Python
python 获取文件下所有文件或目录os.walk()的实例
2018/04/23 Python
基于python log取对数详解
2018/06/08 Python
pytorch获取vgg16-feature层输出的例子
2019/08/20 Python
Python使用Pandas库常见操作详解
2020/01/16 Python
tensorflow实现训练变量checkpoint的保存与读取
2020/02/10 Python
CSS3中的clip-path使用攻略
2015/08/03 HTML / CSS
高级技校毕业生自荐信
2013/11/18 职场文书
老师给学生的表扬信
2014/01/17 职场文书
商超业务员岗位职责
2014/03/12 职场文书
学生吸烟检讨书
2014/09/14 职场文书
甜品店创业计划书
2014/09/21 职场文书
房屋登记授权委托书范本
2014/10/09 职场文书
预备党员个人总结
2015/02/14 职场文书
南京大屠杀观后感
2015/06/02 职场文书
隐形的翅膀观后感
2015/06/10 职场文书
python神经网络编程之手写数字识别
2021/05/08 Python
详解ZABBIX监控ESXI主机的问题
2022/06/21 Servers