如何在 javascript 中访问多个嵌套的子对象？

Question

我有一个更大的代码来处理和排序数据。在其中，我想使用对象以使其更容易和结构更好。我有多个类别，所有类别都有不同的嵌套子对象，我无法访问写入/读取。 我在网上搜索了 w3schools，但找不到我的错误，所以请原谅这个入门级问题！

我写了一个测试函数来更好地理解对象！

function test(){
  var report, time, name, date, value;
  report = 'Income Statement';
  time = 'Annually';
  name = 'Revenue';
  date = '2017';
  value = '10000000';
  data = {}
  data[report] = {}
  data[report][time] = {}
  data[report][time][name] = {}
  data[report][time][name][date] = value;
  console.log(data);
}

据我了解，这段代码的作用是： - 创建一个空对象数据 - 创建一个空的子对象报告 - 创建一个空的子子对象时间 -创建一个空的子子对象名称 - 给子子对象名称一个键/值对 date:value （至少这是我的意图）

首先我尝试跳过创建空对象并直接填充数据{}： 数据 = {} 数据[报告][时间][名称][日期] = 值；但他似乎无法为此设置属性。 所以我像上面一样为所有子类别创建了第一个空子对象，这真的有必要还是我陷入了一个简单的语法错误？

但是他仍然没有记录我想要的输出：

{ 'Income Statement': { Annually: { Revenue: {2017:10000000} } } }

反而给了我：

{ 'Income Statement': { Annually: { Revenue: [Object] } } }

简单地说..我做错了什么？ :D

提前感谢您的任何帮助！ 最好的问候

Answer 1

我不认为你做错了什么。我在 JS 控制台中粘贴了相同的代码，它给出了正确的结果。

Screenshot of console with result of function

初始化对象的不同方法

• 静态数据

let data = {
  'Income Statement': {
    'Annually': {
      'Revenue': {
        '2017': '10000000'
      }
    }
  }
}

document.querySelector("#data-result").innerHTML = JSON.stringify(data)

<div id="data-result"></div>

• 动态数据

var report, time, name, date, value;
report = 'Income Statement';
time = 'Annually';
name = 'Revenue';
date = '2017';
value = '10000000';

let data = {
  [report]: {
    [time]: {
      [name]: {
        [date]: value
      }
    }
  }
}

document.querySelector("#object-result").innerHTML = JSON.stringify(data)

<div id="object-result"></div>

您还可以考虑不同的方式来存储相同的数据。

例子-

let data = [{
  report: 'Income Statement'
  time: 'Annually'
  name: 'Revenue'
  date: '2017'
  value: '10000000'
}]

所以现在，如果您希望将来按日期获取数据，您可以使用过滤器获得该数据

let data_2017 = data.filter(x => x.date === '2017');

Answer 2

没错！！我在控制台收到了{ Income Statement: { Annually: { Revenue: {2017:10000000} } } } 作为您给定代码的输出。

您是否尝试使用 test() 将该数据保存在某个变量中？ 如果是，那么您需要在函数测试的定义末尾使用return data，而不是consol.log(data)。