每日 30 秒 ⏱ 对数组项目进行统计

huayeluoliuhen 发布于2019-08-26 13:32 / 1256人阅读

简介

数组、统计、遍历

根据指定的方法或者参数对数组中的项目进行统计。

// 该源码来自于 https://30secondsofcode.org
const countBy = (arr, fn) =>
  arr.map(typeof fn === "function" ? fn : val => val[fn]).reduce((acc, val) => {
    acc[val] = (acc[val] || 0) + 1;
    return acc;
  }, {});

代码分析

函数通过 Array.prototype.map 来对数据进行清洗，其中利用到 typeof 来判断是否为函数，否则使用 (val) => val[fn] 来读取属性，这个函数在编程中用到的频率挺高的。最后使用 reduce 来对数据进行归集，并返回统计好的数据。

使用场景

统计学生成绩的分布可以传入score属性，函数则会返回由成绩组成的统计对象。统计用户花费区间可以传入一个区间判断函数来获得对应的统计对象。

const students = [
    { name: "xiaoer", score: 80 },
    { name: "xiaosi", score: 90 },
    { name: "menty", score: 50 },
]

const scoreStat = countBy(students, "score")

const users = [
    { name: "xiaoer", cost: 17000 },
    { name: "xiaosi", cost: 8000 },
    { name: "menty", cost: 3000 },
]

const costStat = countBy(users, i => {
    return i.cost > 10000
        ? "high"
        : (i.cost > 5000 ? "mid" : "low")
})

相似代码

判断一个数组中某个数据项出现的次数。

// 该源码来自于 https://30secondsofcode.org
const countOccurrences = (arr, val) => arr.reduce((a, v) => (v === val ? a + 1 : a), 0)

一起成长

在困惑的城市里总少不了并肩同行的 伙伴 让我们一起成长。

如果您想让更多人看到文章可以点个点赞。

如果您想激励小二可以到 Github 给个 小星星。

如果您想与小二更多交流添加微信 m353839115。

本文原稿来自 PushMeTop

GPU云服务器云服务器对数据进行统计排行如何对数据进行统计对统计数据进行说明如何对数据进行统计分析

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/109010.html

每日 30 秒 ⏱ 数组转CSV表格数据

showImg(https://segmentfault.com/img/remote/1460000018771004?w=900&h=500); 简介数组、CSV、表格、工具将一个数组转化为逗号为分割符的字符串（CSV）即表格数据。 // 该源码来自于 https://30secondsofcode.org const arrayToCSV = (arr, delimiter = ,) =...

nanchen2251 2019-08-23 15:38 评论0 收藏0
每日 30 秒 ⏱ 该不该优雅

showImg(https://segmentfault.com/img/remote/1460000018734296?w=900&h=500); 简介可读性、性能、Spread、Reduce 在优雅三连击中有同学提到了可读性这个关键词，就小二个人的观点在某个范围内使用比较常用到的小技巧，可以提升一定的可读性，文中提到的短路运算在初始化变量是提升可读性的，并且在很多提倡优化if 语句...

JohnLui 2019-08-26 13:41 评论0 收藏0
每日 30 秒 ⏱ 对海量数据进行切割

showImg(https://raw.githubusercontent.com/pushmetop/resource/master/30-seconds-for-everyday/chunk/poster.png); 简介数据分割、分页、异步操作、DOM优化把数组按指定大小进行分组，可以用于分页、数据切割、异步操作数据。 // 该源码来自于 https://30secondsofcode....

ShevaKuilin 2019-08-23 15:41 评论0 收藏0
每日 30 秒 ⏱ 优雅初始化数组

showImg(https://segmentfault.com/img/remote/1460000018709740?w=900&h=500); 简介数组、初始化、快速生成数组、内存泄露有时候会需要对数组进行一些初始化，最常用到的便是 for 循环： let num = []; for (let i = 0; i < 10; i++) { // 做一些其他操作 // 或者返...

pcChao 2019-08-26 13:39 评论0 收藏0
每日 30 秒 ⏱ 谁敢与我一战

showImg(https://segmentfault.com/img/remote/1460000018771037?w=900&h=500); 简介 benchmark、基准测试、jsPerf 在优雅插入数组一文中大家最多的评论就是能不能加个基准测试。小二不是不喜欢加基准测试而是现在硬件设备的性能越来越快了，有时候一些操作不是性能问题的主要原因，当然这不是我们不写出好代码的理由。书写...

Dionysus_go 2019-08-23 16:18 评论0 收藏0