Javascript数组迭代精髓,拿去花
数组迭代
数组迭代是处理各数组的利器,编写代码时常常会用到,为我们提供了大大的便利。如果还不知道,真的别告诉别人你知道js哈哈。
以下迭代方法均不会改变原数组,带*为必选对象。
1、arr.forEach(function(*cur,index,arraySelf)) 此方法为每个数组元素调用一次函数(回调函数)
var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(cur, index, array) {
txt = txt + cur;
}
console.log(txt) //返回:45491625
2、arr.map(function(*cur,index,arrSelf))对每个数组元素执行函数来创建新数组,不会对没有值的数组元素执行函数
var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
return value * 2;
}
console.log(number2) //返回[90,8,18,32,50]
3、arr.filter(function(*cur,index,arrSelf)) 创建一个包含通过测试的数组元素的新数组
var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
console.log(over18); //返回[45,25]
4、arr.reduce(function(prev,cur,index,arrSelf),[initialValue]) 从左到右为每一个数组元素执行函数,并缩减数组的元素(不是改变原数组),最终计算为一个值,initialValue为初始值,没设置默认数组第一个元素为初始值,然后函数从数组第二个元素开始执行
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(*prev,*cur, index, arrSelf) {
console.log(prev, cur, index); //返回1,3,1
return prev + cur; //返回10
})
console.log(arr, sum); //这里没有设置初始值,默认为第一个元素1,最后返回**[1,2,3,4] 10 **,若设置初始值为10,则最后sum值为20
arr.every(function(*cur,index,arrSelf)) 检查所有数组值是否通过测试,如全部通过返回true,否则返回false
var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
console.log(allOver18); //返回false
arr.some(function(*cur,index,arrSelf)) 检查是否存在数组值通过测试,如存在返回true,否则返回false
var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
console.log(allOver18); //返回true
arr.find(function(*cur,index,arrSelf)) 返回通过测试函数的第一个数组元素的值
var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
console.log(first); //返回25
以上对各方法的解释和例子参考w3cschool:https://www.w3school.com.cn/js/js_array_iteration.asp
如有不正确,欢迎指出改正
Javascript数组迭代精髓,拿去花的更多相关文章
- 松软科技web课堂:JavaScript 数组迭代方法
数组迭代方法对每个数组项进行操作,听着挺高深,其实,就是对数组对象一次性逐一进行一种操作的一种叫法.(文章来源:www.sysoft.net.cn,加v:15844800162深度交流) Array. ...
- javaScript 数组迭代方法
map 方法 解释:map即映射,返回对每项操作后组成的新数组 let arr=[1,2,3,4,5,6,7,8]; let newArr=arr.map((item)=>{ if(item&g ...
- Javascript数组系列三之迭代方法2
今天我们来继续 Javascript 数组系列的文章,上文 <Javascript数组系列二之迭代方法1> 我们说到一些数组的迭代方法,我们在开发项目实战的过程中熟练的使用可以大大提高我们 ...
- Javascript数组系列二之迭代方法1
我们在<Javascript数组系列一之栈与队列 >中介绍了一些数组的用法.比如:数组如何表现的和「栈」一样,用什么方法表现的和「队列」一样等等一些方法,因为 Javascript 中的数 ...
- JavaScript高级编程——Array数组迭代(every()、filter()、foreach()、map()、some(),归并(reduce() 和reduceRight() ))
JavaScript高级编程——Array数组迭代(every().filter().foreach().map().some(),归并(reduce() 和reduceRight() )) < ...
- 19 JavaScript数组 &数组增删&最值&排序&迭代
关联数组(散列) 关联数组又叫做散列,即使用命名索引. JavaScript数组只支持数字索引. JavaScript对象使用命名索引,而数组使用数字索引,JavaScript数组是特殊类型的对象. ...
- Javascript数组操作
使用JS也算有段时日,然对于数组的使用,总局限于很初级水平,且每每使用总要查下API,或者写个小Demo测试下才算放心,一来二去,浪费不少时间:思虑下,堪能如此继续之?当狠心深学下方是正道. 原文链接 ...
- JavaScript 数组
JavaScript 数组 简介:数组是值的有序集合,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改. 一:创建数组 ...
- 也谈面试必备问题之 JavaScript 数组去重
Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. ...
随机推荐
- Python 每日一练(6)
引言 今天的练习可以说是昨天的那个的反操作,今天要尝试将xls文件的内容写入xml文件中 所涉及到的库有xml,xlrd xls文件内容写入xml python操作excel主要用到xlrd和xlwt ...
- Java IO(十七)FIleReader 和 FileWriter
Java IO(十七)FIleReader 和 FileWriter 一.介绍 FIleReader 和 FileWriter 是读写字符文件的便利类,分别继承于 InputStreamReader ...
- json工具--org.json.jar
org.json可以解析json.把对象包装成json.API文档:http://resources.arcgis.com/en/help/arcobjects-java/api/arcobjects ...
- php实现ajax请求的方法
php实现ajax请求的方法 Ajax页面:第一,了解底层逻辑,正是平常的1个提交在无刷新的条件下发出请求后完成回应,之后去针对你需要的条件来做动作. <!DOCTYPE html> &l ...
- Rocket - tilelink - RAMModel
https://mp.weixin.qq.com/s/9ccDTm6HytvfGN5R2CPoAQ 简单介绍RAMModel的实现. 1. 基本介绍 RAMModel用于定义内存 ...
- Nginx 笔记(四)nginx 原理与优化参数配置 与 nginx 搭建高可用集群
个人博客网:https://wushaopei.github.io/ (你想要这里多有) 一.nginx 原理与优化参数配置 master-workers 的机制的好处 首先,对于每个 ...
- java类加载器是什么?
类加载器是有了解吗? 解析:底层原理的考察,其中涉及到类加载器的概念,功能以及一些底层的实现. 答:顾名思义,类加载器(class loader)用来加载 Java 类到 Java 虚拟机中.一般来说 ...
- Java实现One-way traffic(单向交通)
One-way traffic In a certain town there are n intersections connected by two- and one-way streets. T ...
- java实现第六届蓝桥杯奇怪的数列
奇怪的数列 从X星截获一份电码,是一些数字,如下: 13 1113 3113 132113 1113122113 - YY博士经彻夜研究,发现了规律: 第一行的数字随便是什么,以后每一行都是对上一行& ...
- Jmeter用beanshell将相应中的参数写入到本地文件中
实现效果: 将每次请求的指定参数写入到本地csv文件中. 实际场景:将登录请求中,服务器返回的token值获取并写入到本地csv文件中,供其他接口调用.这样在压测单接口时,不需要再进行登录,避免压测单 ...