许多开发人员喜欢Ruby编程语言，因为它有丰富的标准实用程序库。例如，Ruby中的数组有大量的方法。不过我们的JavaScript也在努力，在字符串和数组方面逐渐丰富了它的标准库。比如在之前的一篇文章中，介绍了新的array.at()方法。今天我们正在研究新的数组组提案（目前处于第3阶段），它引入了新方法array.groupby()和array.groupbytomap()。它们的polyfill可以在core-js库中找到。接下来，让我们看看我们可以从中学到什么。1.array.groupBy()假设我们有一个产品列表，其中每个产品都是一个具有2个属性的对象：名称和类别。constproducts=[{name:'apples',category:'fruits'},{name:'oranges',category:'fruits'},{name:'potatoes',category:'vegetables'}];在上面的示例中，产品是产品对象的数组。现在，对产品列表进行简单的操作，将产品进行分类。constgroupByCategory={'fruits':[{name:'apples',category:'fruits'},{name:'oranges',category:'fruits'},],'vegetables':[{name:'potatoes',类别：'蔬菜'}]};如何从产品数组中获取类似于groupByCategory的数组？通常的方法是使用array.reduce()，如下：constgroupByCategory=products.reduce((group,product)=>{const{category}=product;group[category]=group[category]??[];group[category].push(product);returngroup;},{});console.log(groupByCategory);//{//'fruits':[//{name:'apples',category:'fruits'},//{name:'oranges',category:'fruits'},//],//'vegetables':[//{name:'potatoes',category:'vegetables'}//]//}产品.reduce((acc,product)=>{...})将一组产品缩减为一个按类别对象分组的产品。array.reduce()方法有用且功能强大，但有时它的可读性并不是最好的。因为对数据进行分组是很常见的事情（从SQL中回忆起groupby吗？），数组分组提案引入了两个有用的方法：array.groupBy()和array.groupByToMap()。以下是使用array.groupBy()创建相同类别分组的方法：constgroupByCategory=products.groupBy(product=>{returnproduct.category;});console.log(groupByCategory);//{//'fruits':[//{name:'apples',category:'fruits'},//{name:'oranges',category:'fruits'},//],//'vegetables':[//{name:'土豆',category:'vegetables'}//]//}products.groupBy(product=>{...})返回一个对象，其中每个属性的键是类别名称，值是产品的数组相应的类别。与product.reduce()相比，使用products.groupBy()进行分组代码更少，也更容易理解。array.groupBy(callback)接受一个使用3个参数调用的回调函数：当前数组项、索引和数组本身。回调函数应返回一个字符串：您要将项目添加到的组名称。constgroupedObject=array.groupBy((item,index,array)=>{//...returngroupNameAsString;});2.array.groupByToMap()有时你可能想使用一个Map而不是一个普通的对象。Map的好处在于它可以接受任何数据类型作为键，但普通对象仅限于字符串和符号。那么，如果你想将数据分组到一个Map中，你可以使用array.groupByToMap()方法。array.groupByToMap(callback)的工作方式与array.groupBy(callback)完全相同，只是它将项目分组到Map而不是普通的JS对象中。例如，要按类别名称将一组产品分组到一个ap中，请执行以下操作。constgroupByCategory=products.groupByToMap(product=>{returnproduct.category;});console.log(groupByCategory);//Map([//['水果',[//{name:'苹果',category:'水果'},//{name:'oranges',category:'fruits'},//]],//['vegetables',[//{name:'potatoes',category:'vegetables'}//]//])3.总结如果您想轻松地对数组中的项进行分组（类似于SQL中的GROUPBY），欢迎使用新方法array.groupBy()和array.groupByToMap()。这两个函数都接受一个回调函数，该函数应返回必须插入当前项的组的键。array.groupBy()将项目分组到一个普通的JavaScript对象中，而array.groupByToMap()将它们分组到一个Map实例中。如果你想立即使用这些功能，那么使用core-js库提供的polyfill。作者：AshishLahoti译者：前端小智来源：dmitripavlutin原文：https://dmitripavlutin.com/javascript-array-group/本文转载自微信公众号“大运世界”，可通过以下方式关注二维码。转载本文请联系大千世界公众号。
