👨 作者简介：大家好，我是Taro，前端领域创作者
✒️ 个人主页：唐璜Taro
🚀 支持我：点赞👍+📝 评论 + ⭐️收藏

前言

根据尤大的介绍，来个形象的区别

提示：以下是本篇文章正文内容，下面案例可供参考

一、四者区分

假设有一个数组，每个元素是一个人，你前面站了一排人

1. forEach

forEach

forEach 就是你按顺序一个一个跟他们做点什么，具体要做什么随你便 （🤷‍♂️）

people.forEach(dude => {
  dude.pickUpSoap() 
})

2. map

map

map 就是你手里拿了一个空盒子（一个新的数组），叫他们按顺序一个个把自己的钱包放到你手中的空盒子里，结束的时候，你的盒子里面都是大家的钱包，钱包的顺序和人的顺序一一对应

let emptyBox = people.map(dude =>{
   return dude.wallet 
})

3. reduce

reduce

reduce 就是你拿着钱包，一个个去数看看里面有多少钱，每检查一个，就和前面的总和加起来，这样结束的时候，你就知道知道大家总共有多少钱了

let totalMoney = emptyBox.reduce ((countedMoney, wallet)=>{
   return countedMoney + wallet
},0)

4. filter

filter

reduce 就是你开始拿着钱包数钱的时候，里面钱少于100块的不要 （留在原本的盒子中），比100块多的 丢到一个新的盒子里，这样结束的时候，你又有了一个新的数组，里面都是你想要的多于100的钱包

let morehundredBox= emptyBox.filter(wallet)=>{
   return wallet >= 100
})

Tips : map 和 filter 都是 immutable methods，也就是说它们只会返回一个新数组

总结

以上就是今天要讲的内容，本文仅仅简单介绍了map、forEach、reduce、filter 之间区别，而JavaScript 提供大量能使我们快速便捷地处理数据的函数和方法。