当前位置: 首页 > news >正文

前端js题目大全

一、编写一个 JavaScript 函数 filterAndSortUsers,要求实现以下功能:

  1. 输入:一个包含用户对象的数组 users,每个用户对象的结构如下:

    {
      id: number,       // 用户ID
      name: string,     // 用户名
      age: number,      // 用户年龄
      email: string     // 用户邮箱
    }
  2. 功能

    • 过滤出年龄大于等于 18 岁的用户。

    • 将过滤后的用户按照年龄从小到大排序。

    • 如果年龄相同,则按照 name 的字母顺序排序。

  3. 输出:返回过滤并排序后的用户数组。

  4. 示例

    const users = [
      { id: 1, name: "Alice", age: 25, email: "alice@example.com" },
      { id: 2, name: "Bob", age: 17, email: "bob@example.com" },
      { id: 3, name: "Charlie", age: 25, email: "charlie@example.com" },
      { id: 4, name: "David", age: 30, email: "david@example.com" },
      { id: 5, name: "Eve", age: 16, email: "eve@example.com" }
    ];
    
    const result = filterAndSortUsers(users);
    console.log(result);

    输出结果

    [
      { id: 1, name: "Alice", age: 25, email: "alice@example.com" },
      { id: 3, name: "Charlie", age: 25, email: "charlie@example.com" },
      { id: 4, name: "David", age: 30, email: "david@example.com" }
    ]

参考答案:

function filterAndSortUsers(users) {
  // 过滤出年龄大于等于 18 岁的用户
  const filteredUsers = users.filter(user => user.age >= 18);

  // 按照年龄从小到大排序,如果年龄相同则按照 name 的字母顺序排序
  filteredUsers.sort((a, b) => {
    if (a.age === b.age) {
      return a.name.localeCompare(b.name); // 按 name 字母顺序排序
    }
    return a.age - b.age; // 按年龄从小到大排序
  });

  return filteredUsers;
}

// 测试用例
const users = [
  { id: 1, name: "Alice", age: 25, email: "alice@example.com" },
  { id: 2, name: "Bob", age: 17, email: "bob@example.com" },
  { id: 3, name: "Charlie", age: 25, email: "charlie@example.com" },
  { id: 4, name: "David", age: 30, email: "david@example.com" },
  { id: 5, name: "Eve", age: 16, email: "eve@example.com" }
];

const result = filterAndSortUsers(users);
console.log(result);

运行结果:

[
  { id: 1, name: "Alice", age: 25, email: "alice@example.com" },
  { id: 3, name: "Charlie", age: 25, email: "charlie@example.com" },
  { id: 4, name: "David", age: 30, email: "david@example.com" }
]

考察点:

  1. 数组的 filter 方法:用于过滤符合条件的元素。

  2. 数组的 sort 方法:用于排序,注意排序规则的实现。

  3. 字符串的 localeCompare 方法:用于按字母顺序比较字符串。

  4. 对象属性的访问和比较。

 

二、编写一个 JavaScript 函数 groupByCategory,要求实现以下功能:

  1. 输入:一个包含商品对象的数组 products,每个商品对象的结构如下:

    {
      id: number,          // 商品ID
      name: string,        // 商品名称
      category: string,    // 商品分类
      price: number        // 商品价格
    }
  2. 功能

    • 将商品按照 category 分类。

    • 对于每个分类,计算该分类下商品的总价格。

    • 返回一个对象,键为分类名称,值为该分类下商品的总价格。

  3. 输出:返回一个对象,格式如下:

    {
      "分类名称1": 总价格1,
      "分类名称2": 总价格2,
      ...
    }
  4. 示例

    const products = [
      { id: 1, name: "iPhone", category: "Electronics", price: 999 },
      { id: 2, name: "Samsung TV", category: "Electronics", price: 799 },
      { id: 3, name: "Sofa", category: "Furniture", price: 500 },
      { id: 4, name: "Chair", category: "Furniture", price: 100 },
      { id: 5, name: "Table", category: "Furniture", price: 200 }
    ];
    
    const result = groupByCategory(products);
    console.log(result);

    输出结果

    {
      "Electronics": 1798,
      "Furniture": 800
    }

参考答案:

function groupByCategory(products) {
  return products.reduce((acc, product) => {
    // 如果分类不存在,则初始化为 0
    if (!acc[product.category]) {
      acc[product.category] = 0;
    }
    // 累加当前分类的总价格
    acc[product.category] += product.price;
    return acc;
  }, {});
}

// 测试用例
const products = [
  { id: 1, name: "iPhone", category: "Electronics", price: 999 },
  { id: 2, name: "Samsung TV", category: "Electronics", price: 799 },
  { id: 3, name: "Sofa", category: "Furniture", price: 500 },
  { id: 4, name: "Chair", category: "Furniture", price: 100 },
  { id: 5, name: "Table", category: "Furniture", price: 200 }
];

const result = groupByCategory(products);
console.log(result);

运行结果:

{
  "Electronics": 1798,
  "Furniture": 800
}

考察点:

  1. 数组的 reduce 方法:用于将数组元素累积为一个值(这里是对象)。

  2. 对象的动态属性访问:通过 acc[product.category] 动态访问和更新对象的属性。

  3. 条件判断:检查分类是否已存在,若不存在则初始化。

  4. 累加逻辑:对每个分类的价格进行累加。

三、编写一个 JavaScript 函数 flattenNestedArray,要求实现以下功能:

  1. 输入:一个嵌套的多维数组 arr,数组中的元素可以是任意类型(数字、字符串、对象、数组等)。

  2. 功能:将多维数组扁平化为一维数组。

  3. 输出:返回扁平化后的一维数组。

  4. 示例

    const nestedArray = [1, [2, [3, [4, 5], 6], 7], 8, [9, 10]];
    const result = flattenNestedArray(nestedArray);
    console.log(result);

    输出结果

    [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

参考答案:

function flattenNestedArray(arr) {
  return arr.flat(Infinity);
}

// 测试用例
const nestedArray = [1, [2, [3, [4, 5], 6], 7], 8, [9, 10]];
const result = flattenNestedArray(nestedArray);
console.log(result);

运行结果:

[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

考察点:

  1. flat():扁平化数组方法

  2. Infinity:作为参数传入意味着将数组完全压平,直到所有嵌套的子数组都被展开,即不论数组有多深的嵌套层级,都将被完全展开。

相关文章:

  • 计算机视觉算法实战——表面缺陷检测(主页有源码)
  • UE引擎游戏加固方案解析
  • 一文了解PLM项目管理系统
  • 51单片机-定时器中断
  • 「正版软件」PDF Reader - 专业 PDF 编辑阅读工具软件
  • SpringBoot+Vue3-学习笔记
  • java泛型
  • 交通物联网:概念、历史、现状与展望
  • Redis 字符串(String)
  • 【分布式理论11】分布式协同之分布式事务(一个应用操作多个资源):从刚性事务到柔性事务的演进
  • Vue 监听属性(watch)
  • MySQL数据库入门到大蛇尚硅谷宋红康老师笔记 高级篇 part 2
  • 嵌入式工业级显示器在环保垃圾柜设备中发挥着至关重要的作用
  • Linux 实操篇 组管理和权限管理、定时任务调度、Linux磁盘分区和挂载
  • Linux-C/C++《C/9、信号:基础》(基本概念、信号分类、信号传递等)
  • 2025年archlinux tigervnc分辨率设置不生效的问题
  • Deepseek 与 ChatGPT:AI 浪潮中的双子星较量
  • YOLOv11-ultralytics-8.3.67部分代码阅读笔记-loaders.py
  • 机器视觉--图像的运算(减法)
  • matplotlib无法显示中文的问题
  • 夏天做那个网站致富/北京seo主管
  • 做网站销售的/市场营销策划案例经典大全
  • 用vue框架做的网站/百度营业执照怎么办理
  • 服务器内部打不开网站/seo网络推广优化
  • 公司名字测试/福州seo服务
  • 日志文件WordPress/网站首页seo关键词布局