图解Array的forEach、map、find、reducer、filter方法
时间:2021-08-10
本文章向大家介绍图解Array的forEach、map、find、reducer、filter方法,主要包括图解Array的forEach、map、find、reducer、filter方法使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
JavaScript 数组 Array.prototype 提供了几个非常方便的迭代方法,这里用图解的方式来理解这些方法。
Array.forEach
forEach() 方法对数组的每个元素执行一次提供的函数。
var array1 = ["a", "b", "c"];
array1.forEach(function (element) {
console.log(element);
});
// expected output: "a"
// expected output: "b"
// expected output: "c"
Array.map
map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
var array1 = [1, 4, 9, 16];
// pass a function to map
const map1 = array1.map((x) => x * 2);
console.log(map1);
// expected output: Array [2, 8, 18, 32]
Array.filter
filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
var words = ["spray", "limit", "elite", "exuberant", "destruction", "present"];
const result = words.filter((word) => word.length > 6);
console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]
Array.find
find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
var array1 = [5, 6, 8, 130, 44];
var found = array1.find(function (element) {
return element > 10;
});
console.log(found);
// expected output: 130
Array.reduce
reduce() 方法对数组中的每个元素执行一个由您提供的 reducer 函数(升序执行),将其结果汇总为单个返回值。
const array1 = [1, 2, 3, 4];
const reducer = (acc, cur) => acc + cur;
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15
原文地址:https://www.cnblogs.com/jianjunx/p/15122950.html
- 洛谷P1516 青蛙的约会
- python实现二叉树的创建和遍历
- python中numpy模块下的np.clip()的用法
- Leetcode-Easy 543. Diameter of Binary Tree
- Leetcode-Easy 572. Subtree of Another Tree
- 图解javascript this指向什么?
- 2017/6/8-python正则表达式的使用
- 洛谷P1306 斐波那契公约数
- Angular开发实践(二):HRM运行机制
- Angular开发实践(一):环境准备及框架搭建
- 洛谷P2818 天使的起誓
- 连续子数组的最大和
- 10.25解题报告
- React第三方组件5(状态管理之Redux的使用①简单使用)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Python GUI项目实战(六)实现添加学生信息的功能
- 打卡群刷题总结0816——三角形最小路径和
- 打卡群刷题总结0814——二叉树展开为链表
- 打卡群刷题总结0813——二叉树展开为链表
- 打卡群刷题总结0812——路径总和 II
- SQL中CASE表达式的妙用
- 2w 字 + 40 张图带你参透并发编程!
- RSA 敏感数据加解密方案
- 极客算法训练笔记(一),算法学习方法篇
- 链表:听说用虚拟头节点会方便很多?
- 从JVM设计者的角度来看.class文件结构,一文弄懂.class文件的身份地位
- 抓包分析UDP,TCP和UDP的区别说不上五条就进来看看吧
- 学习|C#线程中AutoResetEvent的使用
- Httprouter—用go实现的高性能路由器
- Django-python最流行的web框架