当前位置: 首页 > news >正文

JS中Array的forEach、map、filter方法区别?

一:基本用法

1、forEach()函数用于对数组中的每个元素执行给定的函数,而它不返回任何值,它只是对每个元素调用传入的函数。这个函数可以接受三个参数:当前元素的值、当前元素的索引和整个数组。

const arr = [1, 2, 3];
arr.forEach((value, index, array) => {console.log(value, index, array);
});
// 输出:1 0 [1, 2, 3]
//      2 1 [1, 2, 3]
//      3 2 [1, 2, 3]

2、map()函数也用于对数组中的每个元素执行给定的函数,但它返回一个新的数组,其中包含该函数的返回值。传入函数的参数和forEach()一样,但返回值被添加到新的数组中。

const arr = [1, 2, 3];
const newArr = arr.map((value, index, array) => {return value * 2;
});
console.log(newArr); // 输出 [2, 4, 6]

3、filter()方法迭代数组中的所有元素,并返回满足指定条件的元素的新数组。它接受一个回调函数,该回调函数接受三个参数:当前元素,当前元素的索引和原始数组。回调函数在数组的每个元素上执行,并将返回值作为一个布尔值。如果回调函数返回值为true,则该元素将会被添加到新的数组中,否则将被排除。

filter方法不改变原始数组。

二:区别

1、forEach()map()的主要区别在于它们的返回值。forEach()不返回任何值,而map()返回一个新数组,其中包含了传入函数的返回值。

2、在 JavaScript 的 forEach 方法中,是无法直接修改遍历的数组元素的,因为 forEach 方法中的回调函数在遍历数组时是只读的,也就是说,它们不能修改原数组元素的值。如果你需要修改数组元素,可以使用 map 方法来创建一个新数组,或者使用 for 循环来遍历数组并直接修改元素的值。

3、filter适合用于过滤掉一部分数据

一句话总结,forEach适合读取每项,map适合改变每项,filter适合过滤掉一部分项

相关文章:

JS中Array的forEach、map、filter方法区别?

一:基本用法 1、forEach()函数用于对数组中的每个元素执行给定的函数,而它不返回任何值,它只是对每个元素调用传入的函数。这个函数可以接受三个参数:当前元素的值、当前元素的索引和整个数组。 const arr [1, 2, 3]; arr.forE…...

Java的Arrays类的sort()方法(41)

目录 sort()方法 1.sort()方法的格式 2.使用sort()方法时要导入的类 3.作用 4.作用的对象 5.注意 6.代码及结果 (1)代码 (2)结果 sort(&…...

Redis安装及其配置文件修改

一、redis 安装 点击即可下载 https://download.redis.io/releases/ 将下载后的包通过xftp上传到服务器 解压,我这边是解压到/usr/local目录下 -- 创建路径 mkdir /usr/local/redis -- 解压 tar -zxvf redis-4.0.0.tar.gz -C /usr/local/redis 为防止编译失败&am…...

VSOMEIP3抓包数据

环境 $ cat /etc/os-release NAME"Ubuntu" VERSION"20.04.6 LTS (Focal Fossa)" IDubuntu ID_LIKEdebian PRETTY_NAME"Ubuntu 20.04.6 LTS" VERSION_ID"20.04" HOME_URL"https://www.ubuntu.com/" SUPPORT_URL"https:/…...

基于PyQt5的图形化界面开发——Windows内存资源监视助手[附带编译exe教程]

基于PyQt5的图形化界面开发——Windows内存资源监视助手[附带编译exe教程] 0. 前言1. 资源信息获取函数——monitor.py2. UI界面——listen.py3. main.py4. 运行效果5. 编译 exe 程序6. 其他PyQt文章 0. 前言 利用 PyQt5 开发一个 windows 的资源监视助手,在使用虚…...

Linus Torvalds发布了第一个Linux内核6.4候选版本

导读自Linux内核6.3发布和下一个内核系列Linux 6.4的合并窗口开放以来,已经过去了一段时间,近日,Linus Torvalds发布了第一个RC(候选发布版)的里程碑,供公众测试。 为期两周的Linux内核6.4合并窗口现已关闭…...

由浅入深Dubbo核心源码剖析环境介绍

目录 1 框架介绍1.1 概述1.2 运行架构1.3 整体设计 2 环境搭建2.1 源码拉取2.2 源码结构2.3 环境导入2.4 测试2.5 管理控制台 1 框架介绍 1.1 概述 Dubbo是阿里巴巴公司开源的一个高性能优秀的服务框架,使得应用可通过高性能的 RPC 实现服务的输出和输入功能&#…...

Java 远程连接 SQLite 数据库

Java 可以使用 JDBC API 来连接 SQLite 数据库。但是,SQLite 不支持远程连接,因为它是一种文件数据库,需要直接访问数据库文件。 如果您需要从远程位置访问 SQLite 数据库,可以将 SQLite 数据库文件放在共享文件夹中,…...

网安面试题大全(附答案)

本文面试题汇总: 防范常见的 Web 攻击 重要协议分布层 arp协议的工作原理 rip协议是什么?rip的工作原理 什么是RARP?工作原理 OSPF协议?OSPF的工作原理 TCP与UDP区别总结 什么是三次握手四次挥手? tcp为什么要三次握手…...

windows 系统扩容C盘注意事项

windows系统大家都不陌生,是大家用的最多的操作系统。在实际的使用中,遇到需要扩容C盘的情况不是很多,但是如果遇到了,有以下几个事项需要大家注意: 剩余空间是否充足 不论当前服务器是物理服务器还是虚拟机&#xff…...

接入支付宝沙箱环境

1、这里有几个重要数据要拿到,一个是支付宝的公钥和私钥,一个是支付的网关,和支付的APPID。这几个数据是要写到代码中的 官方手册:文档地址 1.1 配置沙箱应用环境 https://openhome.alipay.com/develop/sandbox/app 1.2 配置接口…...

用原生JS实现虚拟列表(IT枫斗者)

用原生JS实现虚拟列表 介绍 最近在开发需求的时候,有用到 Antd 的虚拟列表组件 rc-virtual-list ,粗略地看了一下源码,于是萌生了自己写一个虚拟列表的想法。当一个列表需要渲染大量数据的时候是非常耗时的,而且在列表滚动的过程…...

FAT NTFS Ext3文件系统有什么区别

10 年前 FAT 文件系统还是常见的格式,而现在 Windows 上主要是 NTFS,Linux 上主要是Ext3、Ext4 文件系统。关于这块知识,一般资料只会从支持的磁盘大小、数据保护、文件名等各种维度帮你比较,但是最本质的内容却被一笔带过。它们最…...

信息收集思路

1、开发者注释 在网站前端代码中遗留的开发者注释 其中可能包含某些关键信息 ​ 💡 使用F12 、CtrlU 、view-source: 查看前端源码 ​ 3、Robots文件 爬虫协议,网站根目录存在的robots.txt文件,用于告知搜索引擎或爬虫哪些路径和页面不…...

Tauri应用开发(二):创建第一个Tauri应用

创建tauri应用 推荐参考官方文档:https://tauri.app/v1/guides/ 创建命令: npm create tauri-applatest💡注意:请确保Node.js和Rust已经正确安装 在创建过程中,需要根据提示选择配置项。 主要配置有: 项目…...

自信裸辞:一晃 ,失业都3个月了.....

最近,找了很多软测行业的朋友聊天、吃饭 ,了解了一些很意外的现状 。 我一直觉得他们技术非常不错,也走的测开/管理的路径;二三月份裸辞的,然后一直在找工作,现在还没找到工作 。 经过我的分析&#xff0…...

Python3 输入和输出

在Python 3中,你可以使用内置的函数来进行输入和输出操作。 输入(Input): 要从用户那里获取输入,可以使用input()函数。input()函数会等待用户输入,并返回一个字符串。你可以将输入存储在一个变量中&#…...

Mybatis Plus 使用@TableLogic实现逻辑删除

文章目录 步骤1:修改数据库表添加deleted列步骤2:实体类添加属性步骤3:运行删除方法知识点1:TableLogic 接下来要讲解是删除中比较重要的一个操作,逻辑删除,先来分析下问题: 这是一个员工和其所签的合同表,关系是一个员工可以签多…...

2023/5/23总结

super关键字 super关键字的用法和this 关键字的用法相似 this:代表本类对象的引用(this关键字指向调用该方法的对象一般我们是在当前类中使用this关键字,所以我们常说this代表本类对象的引用)super:代表父类存储空间的标识(可以理解为父类对象…...

Squid代理服务器应用

在web架构中,用户一般进入负载均衡层,通过调度来访问web应用层,但是如果访问量太大,并发量较高,web应用层会吃不消,我们把静态资源、经常要访问的资源放入缓存,用户直接访问缓存层,加…...

STM32F4基本定时器使用和原理详解

STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...

现代密码学 | 椭圆曲线密码学—附py代码

Elliptic Curve Cryptography 椭圆曲线密码学(ECC)是一种基于有限域上椭圆曲线数学特性的公钥加密技术。其核心原理涉及椭圆曲线的代数性质、离散对数问题以及有限域上的运算。 椭圆曲线密码学是多种数字签名算法的基础,例如椭圆曲线数字签…...

论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(一)

宇树机器人多姿态起立控制强化学习框架论文解析 论文解读:交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(一) 论文解读:交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...

涂鸦T5AI手搓语音、emoji、otto机器人从入门到实战

“🤖手搓TuyaAI语音指令 😍秒变表情包大师,让萌系Otto机器人🔥玩出智能新花样!开整!” 🤖 Otto机器人 → 直接点明主体 手搓TuyaAI语音 → 强调 自主编程/自定义 语音控制(TuyaAI…...

【RockeMQ】第2节|RocketMQ快速实战以及核⼼概念详解(二)

升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点,但无自动故障转移能力,Master宕机后需人工切换,期间消息可能无法读取。Slave仅存储数据,无法主动升级为Master响应请求&#xff…...

3403. 从盒子中找出字典序最大的字符串 I

3403. 从盒子中找出字典序最大的字符串 I 题目链接:3403. 从盒子中找出字典序最大的字符串 I 代码如下: class Solution { public:string answerString(string word, int numFriends) {if (numFriends 1) {return word;}string res;for (int i 0;i &…...

SiFli 52把Imagie图片,Font字体资源放在指定位置,编译成指定img.bin和font.bin的问题

分区配置 (ptab.json) img 属性介绍: img 属性指定分区存放的 image 名称,指定的 image 名称必须是当前工程生成的 binary 。 如果 binary 有多个文件,则以 proj_name:binary_name 格式指定文件名, proj_name 为工程 名&…...

【C++进阶篇】智能指针

C内存管理终极指南:智能指针从入门到源码剖析 一. 智能指针1.1 auto_ptr1.2 unique_ptr1.3 shared_ptr1.4 make_shared 二. 原理三. shared_ptr循环引用问题三. 线程安全问题四. 内存泄漏4.1 什么是内存泄漏4.2 危害4.3 避免内存泄漏 五. 最后 一. 智能指针 智能指…...

4. TypeScript 类型推断与类型组合

一、类型推断 (一) 什么是类型推断 TypeScript 的类型推断会根据变量、函数返回值、对象和数组的赋值和使用方式,自动确定它们的类型。 这一特性减少了显式类型注解的需要,在保持类型安全的同时简化了代码。通过分析上下文和初始值,TypeSc…...

CVPR2025重磅突破:AnomalyAny框架实现单样本生成逼真异常数据,破解视觉检测瓶颈!

本文介绍了一种名为AnomalyAny的创新框架,该方法利用Stable Diffusion的强大生成能力,仅需单个正常样本和文本描述,即可生成逼真且多样化的异常样本,有效解决了视觉异常检测中异常样本稀缺的难题,为工业质检、医疗影像…...