蓝桥杯模拟赛练习题——司龄统计

时间：2024-04-15 22:51:00

目标

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

  1. 找到 groupByAge 函数，groupByAge 接收一个参数，参数为数组对象，age 代表司龄，name 代表人名，返回一个根据司龄进行分组的对象，key 是司龄，value 是一个数组，其中包含了所有当前司龄的人的对象。
  • 参数格式示例如下：
 [
  { name: "杰克", age: 1 },
  { name: "丽莎", age: 2 },
  { name: "艾娃", age: 5 },
  { name: "约翰", age: 1 },
  { name: "豪尔赫", age: 2 },
]
  • 返回值为 object，格式示例如下：
// 根据司龄（`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。

完成后效果如下：

完成效果

题解

// 按照年龄分组的函数
const groupByAge = (peoples) => {
  // TODO:待补充代码，按照年龄进行分组
  let ageres={};
  for(let i=0;i<peoples.length;i++){
    let age=peoples[i].age
    if(ageres[age]){
      let arr1=ageres[age]
      arr1.push(peoples[i])
      ageres[age]=arr1
    }else{
      let arr2=[]
      arr2.push(peoples[i])
      ageres[age]=arr2
    }
  } 
  return ageres
};

 

const app = Vue.createApp({
  setup() {
    const { updateData } = useECharts();
    let xAxisData = Vue.ref([]); // X 轴数据，司龄从小到大排列
    let seriesData = Vue.ref([]); // Y 轴数据，司龄对应的人数
    const groupedPeople = Vue.ref([]); // table 中显示的数据
    Vue.onMounted(async () => {
      const data = await (await fetch("./mock/data.json")).json();
      groupedPeople.value = groupByAge(data); //把请求回来的数据变成需要的数据格式
      // TODO: 设置 Echars X 轴数据 xAxisData 和 Y 轴数据 seriesData
      
      // 更新 echars 数据
      updateData(xAxisData.value, seriesData.value);
    });

    return {
      groupedPeople,
    };
  },
});

相关文章