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 计划中. ...
随机推荐
- [SD心灵鸡汤]007.每月一则 - 2015.11
1.不要因为世界太过复杂,而背叛了你的单纯. 2.人的一生要疯狂一次,无论是为一个人,一段情,一段路途或一个梦想. 3.时间真的很神奇,你永远不知道它会如何改变你.换句话说:以前难吃的蔬菜.苦涩的啤酒 ...
- 如何在Spring Boot应用启动之后立刻执行一段逻辑
1. 前言 不知道你有没有接到这种需求,项目启动后立马执行一些逻辑.比如简单的缓存预热,或者上线后的广播之类等等.如果你使用 Spring Boot 框架的话就可以借助其提供的接口CommandLin ...
- SpringMVC(二)返回值设置、数据在域中的保存与SpringMVC案例
个人博客网:https://wushaopei.github.io/ (你想要这里多有) 一.返回值的设置 1.返回 String [1]返回 String 默认情况 @RequestMappi ...
- Java实现 蓝桥杯 算法提高VIP Substrings(暴力)
试题 算法提高 Substrings 问题描述 You are given a number of case-sensitive strings of alphabetic characters, f ...
- Java实现 LeetCode 374 猜数字大小 II
375. 猜数字大小 II 我们正在玩一个猜数游戏,游戏规则如下: 我从 1 到 n 之间选择一个数字,你来猜我选了哪个数字. 每次你猜错了,我都会告诉你,我选的数字比你的大了或者小了. 然而,当你猜 ...
- Linux文件搜索命令find
命令find可以根据文件的不同属性在指定的范围内搜索文件,例如: 根据文件名进行查找,在目录/etc下搜索文件名为init( -iname 可以实现不区分大小写进行查找)的文件,实现精准查找,只查找文 ...
- java之单点登录(SSO)
单点登录(SSO):SSO是指在多个应用系统中个,用户只需要登陆一次就可以访问所有相互信任的应用系统.它包括可以将这次主要的登录映射到其他应用中用于同一用户的登陆的机制. SSO的实现过程: 通过上述 ...
- 设计模式系列之建造者模式(Builder Pattern)——复杂对象的组装与创建
说明:设计模式系列文章是读刘伟所著<设计模式的艺术之道(软件开发人员内功修炼之道)>一书的阅读笔记.个人感觉这本书讲的不错,有兴趣推荐读一读.详细内容也可以看看此书作者的博客https:/ ...
- 你真的了解EF吗?关于EntityFramework的高级优化
接上一篇文章.现在写程序,做项目不是说功能做完就完事了,在平常的开发过程中对于性能的考虑也是极其重要的. 关于ef的那些事,今天就来说说吧.首先必须得知道.net ef在程序中的五种状态变化过程与原理 ...
- ASP.NET Core 3.1 WebApi+JWT+Swagger+EntityFrameworkCore构建REST API
一.准备 使用vs2019新建ASP.NET Core Web应用程序,选用api模板: 安装相关的NuGet包: 二.编码 首先编写数据库模型: 用户表 User.cs: public class ...