每日一题：司龄统计

介绍

M 公司马上要进行周年庆典活动了，公司让小蓝做一个员工司龄统计，用来根据司龄给大家发放纪念品，便于计算纪念品费用。但是眼看时间到了小蓝来不及编写，请热心的你帮他完成这个任务吧～

准备

本题已经内置了初始代码，打开实验环境，目录结构如下：

1
2
3
4
5
6
├── css
├── index.html
├── lib
├── js
│   └── index.js
└── mock

其中:

  • index.html 是主页面。
  • css 是存放项目样式的文件夹。
  • mock 是存放项目数据的文件夹。
  • lib 是存放项目依赖的文件夹。
  • js/index.js 是需要补充代码的 js 文件。

注意：打开环境后发现缺少项目代码，请手动键入下述命令进行下载：

1
2
cd /home/project
file="work" && wget "https://labfile.oss.aliyuncs.com/courses/19791/${file}.zip" && unzip "${file}.zip" && rm "${file}.zip"

选中 index.html 右键启动 Web Server 服务（Open with Live Server），让项目运行起来。接着，打开环境右侧的【Web 服务】，就可以在浏览器中看到如下效果：

图片描述

目标

找到 js/index.js 中的，完成其中的 TODO 部分，完成以下目标：

  1. 找到 groupByAge 函数，groupByAge 接收一个参数，参数为数组对象，age 代表司龄，name 代表人名，返回一个根据司龄进行分组的对象，key 是司龄，value 是一个数组，其中包含了所有当前司龄的人的对象。
  • 参数格式示例如下：
1
2
3
4
5
6
7
 [
  { name: "杰克", age: 1 },
  { name: "丽莎", age: 2 },
  { name: "艾娃", age: 5 },
  { name: "约翰", age: 1 },
  { name: "豪尔赫", age: 2 },
]
  • 返回值为 object，格式示例如下：
1
2
3
4
5
6
// 根据司龄（`age`）进行分组，司龄对应司龄人数的数组：
{
   1: [{ name: '杰克', age: 1 }, { name: '约翰', age: 1 }], // 司龄为 1 的数组 
   2: [{ name: '丽莎', age: 2 }, { name: '豪尔赫', age: 2 }], // 司龄为 2 数组 
   5: [{ name: '艾娃', age: 5 } ]// 司龄为 5 数组 
}
  1. 正确设置 ECharts 图表中的 x 轴和 y 轴数据，x 轴表示司龄，从小到大排序，y 轴表示司龄对应的人数个数。如 1 年司龄的有 4 人，则 y 轴对应的数据为 4。

完成后效果如下：

完成效果

规定

  • 请严格按照考试步骤操作，切勿修改考试默认提供项目中的文件名称、文件夹路径、class 名、id 名、图片名等，以免造成判题无法通过。
  • 满足题目需求后，保持 Web 服务处于可以正常访问状态，点击「提交检测」系统会自动判分。

判分标准

  • 完成目标 1，得 5 分。
  • 完成目标 2，得 10 分。

总通过次数: 325 | 总提交次数: 408 | 通过率: 79.7%

题解：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const groupByAge = (peoples) => {
  // TODO:待补充代码，按照年龄进行分组
  // const object = {}
  console.log(peoples);
  const hashMap = {}
  for(let item of peoples) {
    console.log(item);
    if (!hashMap[item.age]) {
      hashMap[item.age] = []
      hashMap[item.age].push(item)
    } else {
      hashMap[item.age].push(item)
    }
  }
  console.log(hashMap);
  return hashMap
};
1
2
3
4
5
// TODO: 设置 Echars X 轴数据 xAxisData 和 Y 轴数据 seriesData
     xAxisData.value = Object.keys(groupedPeople.value)
     for(let item in groupedPeople.value) {
       seriesData.value.push(groupedPeople.value[item].length)
     }