百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT技术 > 正文

JavaScript 中 forEach() 和 Map() 的区别

wptr33 2025-03-14 21:29 12 浏览

大家好,今天我们来聊聊一些对于大多数初学者来说可能比较模糊的高级 JS 数组函数。

下面是这些数组函数的代码片段,

array.forEach((item) => {
      // your code
});const mapArr = array.map((item) => {
     // some code
     return;   //In map() function must always return some value
});

在这里, forEach() 只是循环一些东西,它会执行函数所说的任何事情。并且使用 map() 我们遍历每个项目并返回一个新数组。

嘿,两者似乎做同样的事情,对吧?但它们之间有一个关键的区别。每当我们想要做一个简单的循环并对我们使用 map() 的数组执行操作时,它对操作有限制,它期望操作返回一个元素。本质上,map() 遍历一个数组,对每个元素应用操作,最后将每次调用操作的结果存储到另一个数组中。另一方面,使用 forEach() 操作可能什么也不做,我们可以完全留空或在控制台上打印一些东西,因为所有 forEach() 关心的是遍历元素集合并应用我们告诉它的任何操作对每个元素做。换句话说,map() 转换数组并从中创建一个新数组,而 foreEach() 基于数组执行一系列操作。

在 forEach() 中,要返回一个新数组,我们必须首先创建自己的数组,然后将这些元素压入其中。


让我们通过一个例子来理解,

const arr = [1, 2, 3, 4]
const squaredArr = [];
arr.forEach((item) => {
squaredArr.push(item * item)
})


在上面的代码中,我们创建了一个单独的数组来存储操作的值。 现在让我们看看它在 map() 中的样子,

const squaredArr = arr.map((item) => {
return item * item;
})


现在就是这样。

感谢您抽出时间来阅读! 希望这篇文章对您有所帮助,稍后再见!

相关推荐

每天一个AI姬,AMD核显用户有福了,AI绘画打破 NVIDIA 显卡垄断

使用StableDiffusion进行AI绘画,并不一定只能使用NVIDIA英伟达显卡,甚至,也不一定只能使用独立显卡。今天我们使用AMD6800H核显,并安装了StableDif...

NETworkManager:功能强大的网络管理与问题排除工具

关于NETworkManagerNETworkManager是一款功能强大的网络管理与问题排除工具,该工具完全开源,可以帮助广大研究人员轻松管理目标网络系统并排除网络疑难问题。该工具使用远程桌面、Po...

AMD也能深度学习+免费AI绘画:StableDiffusion+ROCm部署教程!

某国政客扇扇嘴皮子,CN玩硬件和深度学习的圈子里就掀起了一场风暴,这就是著名的嘴皮子效应(误)。没了高性能计算的A100H100倒也能理解,但是美利坚这波把RTX4090禁售了就让人无语了,所以不少做...

windows 下编译 python_rtmpstream

最近在研究数字人,看了大咖的项目(https://github.com/lipku/metahuman-stream),尝试编译此项目的依赖项目python_rtmpstream(https://gi...

如何使用 Python 操作 Git 代码?GitPython 入门介绍

花下猫语:今天,我在查阅如何用Python操作Gitlab的时候,看到这篇文章,觉得还不错,特分享给大家。文中还提到了其它几种操作Git的方法,后续有机会的话,再陆续分享之~~作者:匿蟒...

网上看了不少,终于把ZlmediaKit流媒体框架搭建起来啦

你都站在2023年代了,视频通话、视频直播、视频会议、视频监控就是风口浪尖上的猪师兄,只要你学那么一丁点,拿个高薪的工作不过分吧!我也是半瓶子晃荡的,所以路人呀,共学习,同进步!本篇开始,只讲在Lin...

MacDown:一款 macOS 的强大 Markdown 编辑器

大家好,很高兴又见面了,我是"...

ZLMediaKit安装配置和推拉流

一、ZLMediaKit库简介ZLMediaKit是一个基于...

大神赞过的:学习 WebAssembly 汇编语言程序设计

文/阿里淘系F(x)Team-旭伦随着前端页面变得越来越复杂,javascript的性能问题一再被诟病。而Javascript设计时就不是为了性能优化设计的,这使得浏览器上可以运行的本地语言一...

【Docker】部署WVP视频监控平台

回来Docker系列,今天将会跟大家分享一则关于开源WVP视频监控平台的搭建。先说结论吧,一开始按照网上说的一步一步搭建没有搭建成功,不知道是版本太旧还是我这边机器有问题,尝试了好几个不同方式的搭建都...

MongoDB+GridFS存储文件方案

GridFS是MongoDB的一个内置功能,它提供一组文件操作的API以利用MongoDB存储文件,GridFS的基本原理是将文件保存在两个Collection中,一个保存文件索引,一个保存文...

【开源】强大、创新且直观的 EDA套件

今天分享的LibrePCB是...

Ollama如何制作自己的大模型?

背景Llama3发布了,这次用了...

Ollama使用指南【超全版】

一、Ollama快速入门Ollama是一个用于在本地运行大型语言模型的工具,下面将介绍如何在不同操作系统上安装和使用Ollama。官网:https://ollama.comGithub:http...

基于区块链的价值共享互联网即时通讯应用平台源码免费分享

——————关注转发之后私信回复【源码】即可免费获取到本项目所有源码基于区块链的价值共享互联网即时通讯应用平台,是一个去中心化的任何人都可以使用的通讯网络,是一款基于区块链的价值共享互联网即时通讯AP...