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 相关文章推荐
JS的递增/递减运算符和带操作的赋值运算符的等价式
Dec 08 Javascript
jQuery 获取对象 基本选择与层级
May 31 Javascript
js中prototype用法详细介绍
Nov 14 Javascript
Javasipt:操作radio标签详解
Dec 30 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
jquery表单验证插件validation使用方法详解
Jan 20 Javascript
JavaScript实现弹窗效果代码分析
Mar 09 Javascript
小程序开发基础之view视图容器
Aug 21 Javascript
js如何获取图片url的Blob值并预览示例代码
Mar 07 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
Sep 26 Javascript
在node环境下parse Smarty模板的使用示例代码
Nov 15 Javascript
jquery实现广告上下滚动效果
Mar 04 jQuery
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获取当前日期所在星期(月份)的开始日期与结束日期(实现代码)
2013/06/18 PHP
为百度UE编辑器上传图片添加水印功能
2015/04/16 PHP
详解PHP实现定时任务的五种方法
2016/07/25 PHP
php使用curl模拟浏览器表单上传文件或者图片的方法
2018/11/10 PHP
JS 面向对象之神奇的prototype
2011/02/26 Javascript
基于Jquery的仿照flash放大图片效果代码
2011/03/16 Javascript
浅谈javascript中的作用域
2012/04/07 Javascript
Extjs优化(一)删除冗余代码提高运行速度
2013/04/15 Javascript
js判断变量初始化的三种形式及推荐用的形式
2014/07/22 Javascript
jQuery中animate()方法用法实例
2014/12/24 Javascript
JQuery包裹DOM节点的方法
2015/06/11 Javascript
Javascript 获取鼠标当前的位置实现方法
2016/10/27 Javascript
解决vue中post方式提交数据后台无法接收的问题
2018/08/11 Javascript
vue在手机中通过本机IP地址访问webApp的方法
2018/08/15 Javascript
在vue中读取本地Json文件的方法
2018/09/06 Javascript
nodejs检测因特网是否断开的解决方案
2019/04/17 NodeJs
jQuery/JS监听input输入框值变化实例
2019/10/17 jQuery
通过实例解析json与jsonp原理及使用方法
2020/09/27 Javascript
[07:27]DOTA2卡尔工作室 英雄介绍水晶室女篇
2013/06/21 DOTA
Python基于Opencv来快速实现人脸识别过程详解(完整版)
2019/07/11 Python
django-初始配置(纯手写)详解
2019/07/30 Python
mac使用python识别图形验证码功能
2020/01/10 Python
Numpy 理解ndarray对象的示例代码
2020/04/03 Python
如何提高python 中for循环的效率
2020/04/15 Python
Python压缩模块zipfile实现原理及用法解析
2020/08/14 Python
美国大城市最热门旅游景点门票:CityPASS
2016/12/16 全球购物
里程积分管理买卖交换平台:Points.com
2017/01/13 全球购物
优秀毕业生推荐信
2013/11/02 职场文书
商场消防管理制度
2014/01/12 职场文书
《三顾茅庐》教学反思
2014/04/10 职场文书
爱心捐款倡议书
2014/04/14 职场文书
员工安全承诺书
2014/05/22 职场文书
拓展策划方案
2014/06/03 职场文书
公司与个人合作协议书
2016/03/19 职场文书
Java常用工具类汇总 附示例代码
2021/06/26 Java/Android
PHP实现两种排课方式
2021/06/26 PHP