过滤匹配值和未指定值

JavaScriptJavaScriptBeginner
立即练习

This tutorial is from open-source community. Access the source code

💡 本教程由 AI 辅助翻译自英文原版。如需查看原文,您可以 切换至英文原版

简介

在本实验中,我们将探索 JavaScript 编程,并学习如何一起使用 Array.prototype.reduce()Array.prototype.filter()Array.prototype.map() 方法来创建一个函数,该函数根据条件过滤对象数组,并过滤掉未指定的键。本实验将有助于提高我们对 JavaScript 中函数式编程的理解,以及如何以简洁高效的方式操作对象数组。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") javascript/BasicConceptsGroup -.-> javascript/array_methods("`Array Methods`") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("`Higher-Order Functions`") subgraph Lab Skills javascript/variables -.-> lab-28296{{"`过滤匹配值和未指定值`"}} javascript/data_types -.-> lab-28296{{"`过滤匹配值和未指定值`"}} javascript/arith_ops -.-> lab-28296{{"`过滤匹配值和未指定值`"}} javascript/comp_ops -.-> lab-28296{{"`过滤匹配值和未指定值`"}} javascript/array_methods -.-> lab-28296{{"`过滤匹配值和未指定值`"}} javascript/higher_funcs -.-> lab-28296{{"`过滤匹配值和未指定值`"}} end

根据条件和键过滤对象

要根据条件过滤对象数组,同时过滤掉未指定的键,请使用 reducedFilter() 函数。

以下是具体步骤:

  1. 使用 Array.prototype.filter() 根据谓词 fn 过滤数组,以便返回条件返回真值的对象。

  2. 对过滤后的数组使用 Array.prototype.map() 以返回新对象。

  3. 使用 Array.prototype.reduce() 过滤掉未作为 keys 参数提供的键。

const reducedFilter = (data, keys, fn) =>
  data.filter(fn).map((el) =>
    keys.reduce((acc, key) => {
      acc[key] = el[key];
      return acc;
    }, {})
  );

以下是 reducedFilter() 函数的一个示例用法:

const data = [
  {
    id: 1,
    name: "john",
    age: 24
  },
  {
    id: 2,
    name: "mike",
    age: 50
  }
];

reducedFilter(data, ["id", "name"], (item) => item.age > 24);
// 输出: [{ id: 2, name:'mike'}]

要开始练习编码,请打开终端/SSH 并输入 node

总结

恭喜你!你已经完成了“过滤匹配值和未指定值”实验。你可以在 LabEx 中练习更多实验来提升你的技能。

您可能感兴趣的其他 JavaScript 教程