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 相关文章推荐
arguments对象
Nov 20 Javascript
wordpress之js库集合研究介绍
Aug 17 Javascript
JS 时间显示效果代码
Aug 23 Javascript
jquery垂直公告滚动实现代码
Dec 08 Javascript
jquery插件jquery倒计时插件分享
Dec 27 Javascript
JavaScript判断变量是对象还是数组的方法
Aug 28 Javascript
javascript省市级联功能实现方法实例详解
Oct 20 Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
Nov 13 Javascript
解读vue生成的文件目录结构及说明
Nov 27 Javascript
每天学点Vue源码之vm.$mount挂载函数
Mar 11 Javascript
JavaScript实现星级评价效果
May 17 Javascript
解决vue单页面 回退页面 keeplive 缓存问题
Jul 22 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 处理上百万条的数据库如何提高处理查询速度
2010/02/08 PHP
分享8个最佳的代码片段在线测试网站
2013/06/29 PHP
php中用memcached实现页面防刷新功能
2014/08/19 PHP
Laravel 5框架学习之Blade 简介
2015/04/08 PHP
PHP用swoole+websocket和redis实现web一对一聊天
2019/11/05 PHP
encode脚本和normal脚本混用的问题与解决方法
2007/03/08 Javascript
javascript的trim,ltrim,rtrim自定义函数
2008/09/21 Javascript
一段批量给页面上的控件赋值js
2010/06/19 Javascript
jQuery学习笔记 获取jQuery对象
2012/09/19 Javascript
设为首页和收藏的Javascript代码(亲测兼容IE,Firefox,chrome等浏览器)
2013/11/18 Javascript
Javascript Object 对象学习笔记
2014/12/17 Javascript
js实现类似菜单风格的TAB选项卡效果代码
2015/08/28 Javascript
Bootstrap3制作图片轮播效果
2016/05/12 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
原生JS实现简单的无缝自动轮播效果
2018/09/26 Javascript
Nodejs让异步变成同步的方法
2019/03/02 NodeJs
vue el-tree 默认展开第一个节点的实现代码
2020/05/15 Javascript
vue 计算属性和侦听器的使用小结
2021/01/25 Vue.js
[03:47]2015国际邀请赛第三日现场精彩回顾
2015/08/08 DOTA
对于Python中线程问题的简单讲解
2015/04/03 Python
在Python的Django框架上部署ORM库的教程
2015/04/20 Python
python中引用与复制用法实例分析
2015/06/04 Python
python条件变量之生产者与消费者操作实例分析
2017/03/22 Python
python 通过类中一个方法获取另一个方法变量的实例
2019/01/22 Python
Pyqt5如何让QMessageBox按钮显示中文示例代码
2019/04/11 Python
python openpyxl使用方法详解
2019/07/18 Python
Python随机函数库random的使用方法详解
2019/08/21 Python
关于python导入模块import与常见的模块详解
2019/08/28 Python
Python爬虫进阶之爬取某视频并下载的实现
2020/12/08 Python
魔幻般冒泡背景的CSS3按钮动画
2016/02/27 HTML / CSS
法国在线药房:1001Pharmacies
2021/03/07 全球购物
优秀毕业生就业推荐信
2014/05/22 职场文书
个人主要事迹材料
2014/08/26 职场文书
八月迷情观后感
2015/06/11 职场文书
仓库管理制度范本
2015/08/04 职场文书
了解Kubernetes中的Service和Endpoint
2022/04/01 Servers