大爽前端入门训练001

作者自我介绍:大爽歌, b站小UP主编程1对1辅导老师

基础练习-函数

场景介绍:
记录一些学生信息的数组如下

persons = [
    {
    
     "name": "Zhang three", "age": 24, "grade": 1 },
    {
    
     "name": "li four", "age": 22, "grade": 2 },
    {
    
     "name": "Wang five", "age": 26, "grade": 1 },
    {
    
     "name": "Zhao six", "age": 23, "grade": 1 },
    {
    
     "name": "Qian seven", "age": 25, "grade": 2 },
    {
    
     "name": "Sun eight", "age": 25, "grade": 1 },
    {
    
     "name": "Zhou nine", "age": 21, "grade": 2 },
    {
    
     "name": "Wu ten", "age": 27, "grade": 1 },
    {
    
     "name": "Zheng one", "age": 23, "grade": 1 },
]

单个学生的信息格式如下

{
    "name": 姓名,
    "age": 年龄,
    "grade": 班级
}

现在实现以下几个函数

1 cal_aver_age_by_grade(person_list, grade)

计算某个班级的平均年龄。
该函数接受存储学生信息的数组person_list,和指定的班级grade
返回该班级成员的平均分。

如果输入的班级不存在,则返回undefined

答案

1 cal_aver_age_by_grade(person_list, grade)

这里提供三种解法
前两种建议掌握,第三种可以了解。

  • 基础for循环写法
function cal_aver_age_by_grade(person_list, grade){
    
    
    var age_sum = 0;
    var count = 0;
    for(person of person_list){
    
    
        if (person["grade"] == grade) {
    
    
            age_sum += person["age"];
            count += 1
        }
    }

    if(count == 0){
    
    
        return undefined;
    }

    return age_sum / count

}
  • 使用filter, mapforeach实现
function cal_aver_age_by_grade(person_list, grade){
    
    
    var grade_persons = person_list.filter(person => person.grade == grade );
    var ages = grade_persons.map(person => person.age);

    var age_sum = 0;
    ages.forEach(age => {
    
    
        age_sum += age;
    });

    return age_sum / ages.length;
}
  • *使用filter, mapreduce实现
function cal_aver_age_by_grade(person_list, grade){
    
    
    var grade_persons = person_list.filter(person => person.grade == grade );
    var ages = grade_persons.map(person => person.age);

    var age_sum = ages.reduce((a, b) => a + b, 0);
    return age_sum / ages.length;
}

调用函数的代码

result = cal_aver_age_by_grade(persons, 1)
console.log(result);

期望输出

24.666666666666668

拓展介绍reduce
参考文档: Array.prototype.reduce()

The reduce() method executes a user-supplied “reducer” callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element.
reduce() 方法, 按顺序对数组的每个元素, 执行用户提供的“reducer”回调函数(就是括号里面写的匿名函数),传入前一个元素的计算返回值。
(括号里面写的匿名函数, 即用户提供的reducer回调函数, 接受两个参数, 第一个参数是上个元素调用该函数计算后的返回值,第二个参数是当前元素)

The final result of running the reducer across all elements of the array is a single value.
在数组的所有元素上运行 reducer 的最终结果是单个值。
The first time that the callback is run there is no “return value of the previous calculation”.
(那么问题来了),对首个元素执行回调函数时,不存在“上一次(上个元素)的计算结果”。
(所以需要设置初始值,即设置没有上个元素,也就是没有上个元素计算返回值时,第一个参数使用的值。该初始值设置在返回值中,返回值的第二个元素就是初始值)

If supplied, an initial value may be used in its place.
如果需要回调函数从数组索引为 0 的元素开始执行,则需要传递初始值。
Otherwise the array element at index 0 is used as the initial value and iteration starts from the next element (index 1 instead of index 0).

否则,数组索引为 0 的元素将被作为初始值initialValue,迭代器将从第二个元素开始执行(索引为 1 而不是 0)。

帮助你理解 reduce()的示例——计算数组所有元素的总和:

const array1 = [1, 2, 3, 4];

// 0 + 1 + 2 + 3 + 4
const initialValue = 0;
const sumWithInitial = array1.reduce(
  (previousValue, currentValue) => previousValue + currentValue,
  initialValue
);

console.log(sumWithInitial);
// expected output: 10

猜你喜欢

转载自blog.csdn.net/python1639er/article/details/124968124