在对象中获取嵌套值

JavaScriptJavaScriptBeginner
立即练习

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

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

简介

在本实验中,我们将探索如何使用名为 dig 的函数来获取 JavaScript 对象中的嵌套值。此函数可用于从复杂的嵌套对象中检索特定值,从而更轻松地访问所需信息。通过本实验,你将学习如何使用 in 运算符和 reduce() 方法遍历嵌套对象并找到目标值。


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/cond_stmts("`Conditional Statements`") javascript/BasicConceptsGroup -.-> javascript/array_methods("`Array Methods`") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("`Higher-Order Functions`") subgraph Lab Skills javascript/variables -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/data_types -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/arith_ops -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/comp_ops -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/cond_stmts -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/array_methods -.-> lab-28357{{"`在对象中获取嵌套值`"}} javascript/higher_funcs -.-> lab-28357{{"`在对象中获取嵌套值`"}} end

如何在 JSON 对象中获取嵌套值

要根据给定的键从嵌套的 JSON 对象中检索目标值,请执行以下步骤:

  • 打开终端/SSH 并输入 node 以开始练习编码。
  • 使用 in 运算符检查 obj 中是否存在 target
  • 如果找到 target,则返回 obj 中相应的值。
  • 如果未找到 target,则使用 Object.values()Array.prototype.reduce() 对每个嵌套对象递归调用 dig 函数,直到找到第一个匹配的键/值对。

以下是 dig 函数的代码:

const dig = (obj, target) =>
  target in obj
    ? obj[target]
    : Object.values(obj).reduce((acc, val) => {
        if (acc !== undefined) return acc;
        if (typeof val === "object") return dig(val, target);
      }, undefined);

要使用 dig 函数,首先创建一个具有嵌套层级的 JSON 对象,如下所示:

const data = {
  level1: {
    level2: {
      level3: "some data"
    }
  }
};

然后,使用 JSON 对象和所需的键调用 dig 函数:

dig(data, "level3"); //'some data'
dig(data, "level4"); // undefined

这些示例将返回 data 对象中 level3 键的值,对于不存在的 level4 键则返回 undefined

总结

恭喜你!你已经完成了“在对象中获取嵌套值”实验。你可以在 LabEx 中练习更多实验来提升你的技能。

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